Button

Dispara una acción. Variantes primary, outline, ghost, success, destructive y link.

FormulariosBase UI
Abrir en Studio

Reglas Konfront

  • Una acción principal por vista.
  • Tamaños XS 24 · S 32 · M 36 · L 44; texto 14 Medium; radio --radius-lg.
  • success usa --success-strong (#0B4F2C), una por vista y nunca junto al primario. Nunca #12B669 como fondo.
  • Loading: el spinner reemplaza al icono y el ancho se mantiene. Disabled al 50 %.
  • Verbos en el texto: «Registrar», «Publicar». Nunca «OK» ni «Aceptar» a secas.
  • Solo tokens del tema: ningún hex suelto ni clases de la paleta default de Tailwind.
  • Sin variantes nuevas fuera del registro. Si un cliente necesita otra, se registra en su namespace.
  • Copy en español de México con voz Konfront: verbos en las acciones, frases completas en los mensajes.

Accesibilidad

  • Foco visible con anillo de 2 px en el color de foco del tema y offset de 2 px.
  • Todo es operable con teclado y el orden de tabulación sigue el orden visual.
  • Los pares de texto cumplen contraste AA en todos los temas publicados; el estudio bloquea los que no.