Tokens de diseño

Fundación

Todos los valores visuales de Nexo UI Kit provienen de las propiedades personalizadas --nx-* definidas en tokens.css.

Colores de marca

--nx-cyan#00f5ff

--nx-purple#a855f7

--nx-magenta#ff2d78

--nx-indigo#6366f1

Variantes suaves

--nx-cyan-soft#67f8ff

--nx-purple-soft#c084fc

--nx-magenta-soft#ff6ba3

--nx-indigo-soft#818cf8

Estados semánticos

--nx-success#4ade80

--nx-warning#fbbf24

--nx-danger#f87171

--nx-info#60a5fa

Superficies

--nx-bg-primary#0a0a0f

--nx-bg-secondary#0f0f1a

--nx-bg-card#12121f

--nx-bg-card-hover#1a1a2e

--nx-bg-elevated#1e1e32

Bordes

--nx-borderrgba(168, 85, 247, 0.15)

--nx-border-glowrgba(0, 245, 255, 0.3)

--nx-border-strongrgba(168, 85, 247, 0.35)

Colores de texto

--nx-text-primary#f0f0ff

--nx-text-secondary#babac2

--nx-text-muted#9a9ab0

--nx-text-inverse#0a0a0f

Tipografía

Fuentes

Inter — --nx-font-body

Outfit — --nx-font-display

Escala tipográfica

Título 2XL--nx-text-2xl

Título XL--nx-text-xl

Encabezado grande--nx-text-lg

Cuerpo grande--nx-text-md

Cuerpo base--nx-text-base

Cuerpo pequeño--nx-text-sm

Leyenda extra pequeña--nx-text-xs

Pesos

El veloz murciélago hindú comía feliz cardillo y kiwi--nx-weight-normal (400)

El veloz murciélago hindú comía feliz cardillo y kiwi--nx-weight-medium (500)

El veloz murciélago hindú comía feliz cardillo y kiwi--nx-weight-semibold (600)

El veloz murciélago hindú comía feliz cardillo y kiwi--nx-weight-bold (700)

El veloz murciélago hindú comía feliz cardillo y kiwi--nx-weight-extrabold (800)

Escala de espaciado

--nx-space-1

--nx-space-2

--nx-space-3

--nx-space-4

--nx-space-5

--nx-space-6

--nx-space-8

--nx-space-10

--nx-space-12

--nx-space-16

Radio

--nx-radius-sm

--nx-radius-md

--nx-radius-lg

--nx-radius-xl

--nx-radius-full

Degradados

--nx-gradient-main

--nx-gradient-subtle

--nx-gradient-brand

--nx-gradient-magenta