Tokens primitivos

Los tokens primitivos son los valores base del Design System que Consents admite como valores de design.tokens. La columna Token muestra la referencia abreviada exacta que debe usar el consumidor; no incluye dependencias internas usadas para resolver aliases.

Esta referencia se genera desde la réplica MasStack DS 0.1.0, fechada el 2026-07-09. Consulta Tokens de dominio para saber qué familias puede usar cada token público.

Primitivos de color

Todos los tokens de dominio de color admiten estos primitivos. También aceptan colores CSS válidos.

Colores blue

Token	Valor
`blue.50`	`#EFF6FF`
`blue.100`	`#EDF4FF`
`blue.200`	`#AEC7EE`
`blue.300`	`#A2C1F8`
`blue.400`	`#82ABF5`
`blue.500`	`#6994FF`
`blue.600`	`#4686FF`
`blue.700`	`#447FED`
`blue.800`	`#3466F5`
`blue.900`	`#1D51E4`
`blue.950`	`#003EB7`

Colores comunes

Token	Valor
`common.black`	`#000000`
`common.white`	`#FFFFFF`

Colores emerald

Token	Valor
`emerald.50`	`#ECFDF5`
`emerald.100`	`#D1FAE5`
`emerald.200`	`#A7F3D0`
`emerald.300`	`#6EE7B7`
`emerald.400`	`#34D399`
`emerald.500`	`#10B981`
`emerald.600`	`#059669`
`emerald.700`	`#047857`
`emerald.800`	`#065F46`
`emerald.900`	`#064E3B`
`emerald.950`	`#002C22`

Colores fuchsia

Token	Valor
`fuchsia.50`	`#FEF2F7`
`fuchsia.100`	`#FCE5F1`
`fuchsia.200`	`#F9CCE3`
`fuchsia.300`	`#F5A5CF`
`fuchsia.400`	`#F067AB`
`fuchsia.500`	`#E52E83`
`fuchsia.600`	`#D1126E`
`fuchsia.700`	`#B00C5C`
`fuchsia.800`	`#920A4D`
`fuchsia.900`	`#7A0940`
`fuchsia.950`	`#570B2F`

Colores green

Token	Valor
`green.50`	`#F0FDF4`
`green.100`	`#F0FAE8`
`green.200`	`#D4EABE`
`green.300`	`#C0E19F`
`green.400`	`#A6D579`
`green.500`	`#92CC5C`
`green.600`	`#60B129`
`green.700`	`#5B9F2E`
`green.800`	`#4A9537`
`green.900`	`#3E8B4E`
`green.950`	`#296133`

Colores grey

Token	Valor
`grey.50`	`#FAFAFA`
`grey.100`	`#F5F5F5`
`grey.200`	`#EEEEEE`
`grey.300`	`#E0E0E0`
`grey.400`	`#BDBDBD`
`grey.500`	`#9E9E9E`
`grey.600`	`#757575`
`grey.700`	`#616161`
`grey.800`	`#424242`
`grey.900`	`#1F1F1F`
`grey.950`	`#0A0A0A`

Colores neutral

Token	Valor
`neutral.50`	`#FAFBFC`
`neutral.100`	`#F3F4F6`
`neutral.200`	`#E5E7EB`
`neutral.300`	`#D1D5DB`
`neutral.400`	`#9CA3AF`
`neutral.500`	`#6B7280`
`neutral.600`	`#4B5563`
`neutral.700`	`#374151`
`neutral.800`	`#1F2937`
`neutral.900`	`#1A2330`
`neutral.950`	`#111827`

Colores orange

Token	Valor
`orange.50`	`#FFF7E9`
`orange.100`	`#FCEEE0`
`orange.200`	`#F8D1AD`
`orange.300`	`#ECAE75`
`orange.400`	`#F29C52`
`orange.500`	`#FF7901`
`orange.600`	`#E2681A`
`orange.700`	`#D55E35`
`orange.800`	`#C93A23`
`orange.900`	`#B03E1B`
`orange.950`	`#902906`

Colores purple

Token	Valor
`purple.50`	`#FBF2F9`
`purple.100`	`#F2E5EF`
`purple.200`	`#DDBDD7`
`purple.300`	`#C792BE`
`purple.400`	`#B168A7`
`purple.500`	`#A14993`
`purple.600`	`#8E328A`
`purple.700`	`#7F3389`
`purple.800`	`#6C3588`
`purple.900`	`#5A3581`
`purple.950`	`#422B6E`

Colores red

Token	Valor
`red.50`	`#FFF5F4`
`red.100`	`#F6DFDD`
`red.200`	`#F2A69E`
`red.300`	`#ED786A`
`red.400`	`#ED5E4E`
`red.500`	`#EC5561`
`red.600`	`#D53D46`
`red.700`	`#BF2828`
`red.800`	`#B72627`
`red.900`	`#A62319`
`red.950`	`#8A1910`

Colores slate

Token	Valor
`slate.50`	`#F9FAFC`
`slate.100`	`#F1F5F9`
`slate.200`	`#E2E8F0`
`slate.300`	`#CBD5E1`
`slate.400`	`#94A3B8`
`slate.500`	`#64748B`
`slate.600`	`#475569`
`slate.700`	`#334155`
`slate.800`	`#1E293B`
`slate.900`	`#0F172A`
`slate.950`	`#0C0F18`

Colores yellow

Token	Valor
`yellow.50`	`#FEFCE8`
`yellow.100`	`#FEF9C2`
`yellow.200`	`#FEF08A`
`yellow.300`	`#FFE86F`
`yellow.400`	`#FDE047`
`yellow.500`	`#FFE200`
`yellow.600`	`#EAB308`
`yellow.700`	`#CA8A04`
`yellow.800`	`#A16207`
`yellow.900`	`#854D0E`
`yellow.950`	`#713F12`

Primitivos de espaciado

Los valores numéricos están expresados en píxeles. El catálogo público de Consents limita el espaciado a 80px.

Token	Valor
`0`	0px
`25`	1px
`50`	2px
`100`	4px
`150`	6px
`200`	8px
`300`	12px
`400`	16px
`500`	20px
`600`	24px
`800`	32px
`1000`	40px
`1200`	48px
`1400`	56px
`1600`	64px
`2000`	80px

Primitivos de tamaño y radio

Los radios admiten estos tamaños excepto full. statement-help-icon-size está restringido a 400, 500, 600 y 800.

Token	Valor
`0`	0px
`25`	1px
`50`	2px
`100`	4px
`150`	6px
`200`	8px
`300`	12px
`400`	16px
`500`	20px
`600`	24px
`800`	32px
`1000`	40px
`1400`	56px

Primitivos de borde

Token	Valor
`0`	0px
`50`	0.5px
`100`	1px
`120`	1.2px
`160`	1.6px
`200`	2px
`400`	4px
`600`	6px
`800`	8px

Primitivos de familia tipográfica

La API canónica solo permite sobrescribir individualmente la familia. Tamaño, peso, interlineado y espaciado proceden del estilo semántico completo.

Token	Valor
`Inter`	`Inter`
`Menlo`	`Menlo`