Sistema
Todo lo visual de Soberbia sale de estos tokens, definidos una sola vez en app/globals.css. Cambiar la marca es editar ese bloque: ningún componente fija un color, una tipografía ni un radio por su cuenta.
Color
bg
#F7EBEB
Fondo de página
surface
#F0DEDF
Pie, bandas editoriales, hover
petal
#E4C6CB
Chips, bloques de campaña
rose
#DAB2B7
Tinte ilustrativo
dusty
#C8969A
Detalle de apoyo
accent
#B97E7F
CTA principal, barra de anuncio
accent-600
#9E6567
Hover de CTA, énfasis en cursiva
accent-700
#855253
CTA pulsado
ink
#3A2326
Texto principal
ink-2
#6B4A4E
Cuerpo y descripciones
ink-3
#85636A
Etiquetas y texto atenuado
sale
#9C3F4A
Precio rebajado
success
#5E7358
En stock
warning
#8A5E14
Pocas unidades
error
#A8352F
Errores, agotado
Tipografía
Algo precioso
Encuentra lo tuyo
Collar Lazo de Seda
Tres lazos de satén anudados a mano, perlas de agua dulce y un pequeño colgante de terciopelo. Se lleva corto, sobre una camisa blanca o con el pelo recogido.
Envío gratis desde ₡50 000
Espaciado
- 4
- 8
- 12
- 16
- 24
- 32
- 48
- 64
- 96
- 144
Forma y movimiento
0 en todo el sistema. La única excepción es el sello redondo de la marca.
Curva cubic-bezier(.2,.7,.2,1). 200 ms para lo pequeño, 350 ms en menús, 500 ms en cajones y 900 ms en el zoom de imagen.