Orali Design System

Propósito

Escala numérica para encuestas, por ejemplo NPS del 1 al 10.

Cada número es un botón con aria-pressed.

Alto de 44 px.

El componente real, en vivo.

Las props min y max definen el rango (por defecto 1 a 10). Probalo.

NPS.

Los tokens globales que usa el CSS real del componente.

Token	Valor	Uso
	6px
	32px
	44px
	1px
	#e4e4e4	Solo divisores y bordes decorativos. Controles usan form.border
	4px	Badges, skeletons
	#ffffff	Cards, modales, header
	#1a1a1a	Texto principal (17.4:1)
	14px
	20px
	500
	150ms
	cubic-bezier(0.4, 0, 0.2, 1)
	#1a1a1a	Hover y selección de chips y filtros
	2px	Campos: borde de 2px en foco (box-shadow inset para no mover el layout)
	#e30613	Campos en foco: reemplaza el color del borde
	2px
	#1a1a1a	Footer, secciones oscuras
	#ffffff