SpecularButton

Botón de cristal con luz especular que recorre su borde.

  • Código: RODD·CP·040
  • Familia: Componentes
  • Origen: React Bits (David Haz) · Licencia MIT + Commons Clause

Cómo instalarlo

npx shadcn@latest add https://reactbits.dev/r/SpecularButton-TS-TW

Cuándo usarlo

Sustituyen a un componente estándar cuando la experiencia es parte del producto.

Props para personalizarlo

PropTipoPor defecto
childrenReactNode"Get Started"
size"sm" | "md" | "lg""lg"
radiusnumber18
tintstring"#ffffff"
tintOpacitynumber0
blurnumber0
textColorstring"#f5f5f5"
lineColorstring"#ffffff"
baseColorstring"#525252"
intensitynumber1
shineSizenumber10
shineFadenumber40
thicknessnumber1
speednumber0.35
followMousebooleantrue
proximitynumber250
autoAnimatebooleanfalse
disabledbooleanfalse
onClickMouseEventHandler-
type"button" | "submit" | "reset""button"
classNamestring""

Otros efectos de componentes

  • TiltedCard — Tarjeta 3D que se inclina hacia el puntero.
  • BorderGlow — Borde con brillo de malla degradada que sigue la dirección del cursor.
  • CardSwap — Pila de tarjetas que se intercambian solas.
  • CssBox — Caja 3D hecha solo con CSS que puedes rotar.
  • DomeGallery — Cúpula 3D de imágenes que giras con el dedo.
  • FlowingMenu — Menú con marquesina que entra por el borde más cercano.