Herramienta de color práctica

Generador de tema shadcn

Mapea una paleta a variables CSS estilo shadcn para background, foreground, primary, muted, accent y destructive.

Abrir en la herramienta principalVolver a la herramienta
EnglishItalianoEspañolFrançaisDeutsch

Qué ofrece esta página

  • Usa tonos generados para variables semanticas.
  • Separa neutrales y marca para componentes coherentes.
  • Comprueba contraste de primary/destructive foreground.

Bueno para

  • Apps React
  • Librerias UI
  • Variables CSS

Cómo usarlo

Mapea una paleta a variables CSS estilo shadcn para background, foreground, primary, muted, accent y destructive.

Generador de paletasMapea una paleta a variables CSS estilo shadcn para background, foreground, primary, muted, accent y destructive.Checker WCAGMapea una paleta a variables CSS estilo shadcn para background, foreground, primary, muted, accent y destructive.Extractor de imágenesMapea una paleta a variables CSS estilo shadcn para background, foreground, primary, muted, accent y destructive.
¿Puedo usarlo con el generador principal?

Sí. Empieza aquí, abre la herramienta principal de Chromaforge con el mismo color base y exporta la paleta.