Componentes
Botones
Acciones claras con jerarquía evidente. El botón primario lleva un degradado coral que se desplaza al pasar el ratón; el secundario es casi negro.
Variantes#
Tamaños#
sm (36 px) para barras densas, md (48 px) por defecto, lg (56 px) para la acción principal en móvil.
Con iconos y estados#
API#
| Prop | Tipo | Por defecto | Descripción |
|---|---|---|---|
| variant | primary | secondary | outline | soft | ghost | link | nature | danger | primary | Jerarquía visual |
| size | sm | md | lg | md | Altura 36 / 48 / 56 px |
| block | boolean | false | Ocupa todo el ancho |
| loading | boolean | false | Muestra spinner, desactiva y mantiene el ancho |
| leading / trailing | ReactNode | — | Iconos antes/después del texto |
| asChild | boolean | false | Renderiza el hijo (p. ej. un <Link>) con los estilos del botón |