LUMIA

Referencia interna

Sistema de diseño

Tokens visuales de Lumia 2.0. Fuente en código: shared/design-system/tokens.ts

Paleta lumia

Clases Tailwind: bg-lumia-*, text-lumia-*

lumia-black

#0F0F0F

Textos fuertes, botones primary

lumia-ink

#2B2B2B

Texto principal del cuerpo

lumia-gold

#C9A24A

Acentos, badges, hover links

lumia-beige

#E8DCC8

Fondos secundarios, hover

lumia-cream

#F6F1E7

Cards, superficies cálidas

lumia-canvas

#FAF8F5

Fondo general de la tienda

lumia-success

#D6E5DA

Estados positivos suaves

Tipografía

font-display — Cormorant Garamond

Velas que cuentan historias

Títulos, hero, precios

font-sans — DM Sans

Elaboradas a mano en pequeños lotes.

Cuerpo, navegación, UI

Botones

Sombras y radios

shadow-soft

shadow-soft-lg

sin sombra

rounded-3xl

Tokens (referencia)

{
  "colors": {
    "black": "#0F0F0F",
    "cream": "#F6F1E7",
    "gold": "#C9A24A",
    "beige": "#E8DCC8",
    "ink": "#2B2B2B",
    "canvas": "#FAF8F5",
    "success": "#D6E5DA"
  },
  "fonts": {
    "display": [
      "\"Cormorant Garamond\"",
      "Georgia",
      "serif"
    ],
    "sans": [
      "\"DM Sans\"",
      "system-ui",
      "sans-serif"
    ]
  },
  "maxWidth": "1280px",
  "shadows": {
    "soft": "0 4px 24px -4px rgba(43, 43, 43, 0.08), 0 8px 32px -8px rgba(43, 43, 43, 0.06)",
    "softLg": "0 12px 40px -12px rgba(43, 43, 43, 0.12)"
  },
  "radii": {
    "sm": "rounded-xl",
    "md": "rounded-2xl",
    "lg": "rounded-3xl",
    "full": "rounded-full",
    "button": "rounded-xl"
  },
  "transitions": {
    "fast": "150ms",
    "normal": "200ms"
  }
}

Documentación extendida: docs/DESIGN_SYSTEM.md