Glow Arrow Button

1import { ArrowRight } from "lucide-react";2
3export function GlowArrowButton() {4  return <button type="button" className="glow-arrow-button"><span>Get Started</span><ArrowRight aria-hidden="true" size={16} strokeWidth={2.3} /></button>;5}

1.glow-arrow-button {2  display: inline-flex;3  align-items: center;4  gap: 8px;5  border: 0;6  border-radius: 999px;7  background: light-dark(#ffffff, #f0f0f0);8  padding: 16px 32px;9  color: light-dark(#14181e, #111);10  font-size: 16px;11  font-weight: 500;12  cursor: pointer;13  transition: box-shadow .3s ease;14}15.glow-arrow-button svg {16  transition: transform .3s ease;17}18.glow-arrow-button:hover, .glow-arrow-button:focus-visible {19  box-shadow: 0 3px 20px light-dark(#14181e26, #f0f0f080);20}21.glow-arrow-button:hover svg, .glow-arrow-button:focus-visible svg {22  transform: translateX(4px);23}24.glow-arrow-button:focus-visible {25  outline: 2px solid #f97316;26  outline-offset: 4px;27}