Botones, chips, controles segmentados y menús: todo lo que dispara una acción.

Acciones

6 componentes

Button

La acción principal del kit. Ocho variantes visuales con la misma API: elige el énfasis (brand → ghost), el tamaño, y añade iconos o estados de carga sin cambiar de componente.

Playground

cambia las props y el código se regenera

variant

size

fullWidth

Inactivo

loading

Inactivo

asChild

Inactivo

shadow

radius

iconOnly

Inactivo

tone

children (Texto)

Variantes

Con iconos

leadingIcon / trailingIcon

Tamaños

Estados

Chip

Etiquetas compactas para filtros, tags y estados. Se vuelven removibles al pasar onRemove, y heredan los seis tonos semánticos del tema.

Playground

cambia las props y el código se regenera
Japón

tone

variant

size

removeLabel

children (Texto)

Removibles

onRemove
ARPGGachaLucha

Tonos y variantes

publicadobetaretiradoparcheneutral

Tamaños e iconos

smmdlg

Segmented

Selector de opción única tipo iOS para alternar vistas o rangos. Controlado o no controlado, con variantes pill y outline, iconos por opción y modo de ancho completo.

Playground

cambia las props y el código se regenera

options*

size

fullWidth

Inactivo

variant

disabled

Inactivo

aria-label

className

style

Controlado

value: "semana"

Variante outline · con iconos

Ancho completo · tamaño sm

Toolbar

Contenedor horizontal para grupos de acciones relacionadas, con variantes flat/card y dos densidades.

Variante card

Variante flat · densidad compacta

Kbd

Representa teclas físicas con el elemento semántico <kbd>. Tres tamaños, pensado para tooltips, menús y documentación.

Tamaños

Esc⌘ KEnter

Combinaciones

en contexto
Buscar componente KGuardar borrador CtrlSNavegar demos
Tsukira · Acciones6 componentes