Pares de la paleta evaluados según WCAG 2.1. AAA ≥ 7:1 · AA ≥ 4.5:1 · texto grande ≥ 3:1. Solo se muestran combinaciones utilizables.

Escala de tonos 50–950 de cada color, estilo sistema de diseño (Tailwind). Clic en cualquier tono para copiarlo. Ideal para hovers, bordes, fondos suaves y estados.

Tu paleta aplicada a una interfaz real: navegación, hero, métricas, tarjetas y formulario. Los roles se asignan automáticamente por luminancia, saturación y contraste.

EstudioEmpezar
Nuevo · v2.0

Diseño que se siente inevitable

Cada color de tu paleta trabajando en su rol correcto: jerarquía, énfasis y descanso visual. Así se ve en producción.

Probar gratisVer demo
Suscribirme

Así percibe tu paleta una persona con deficiencia de visión cromática. El 8% de los hombres tiene alguna forma de daltonismo — verificá que tus estados no dependan solo del color.

Visión típica — sin filtro aplicado.

CSS Custom Properties
Tailwind config
SCSS variables
JSON tokens