Generador de Paletas de Color
Se ejecuta localmente en tu navegadorCrea paletas armónicas bloqueables, escalas tonales OKLCH y tokens de diseño
Admite HEX con alfa, RGB, HSL, OKLCH y nombres CSS.
Colores de la Paleta
Se redujo el croma para mapear a sRGB.
Inspector y Tokens
Inspeccionar
Color 1
- HEX
- #6366F1
- RGB
- rgb(99 102 241)
- HSL
- hsl(238.732 83.529% 66.667%)
- OKLCH
- oklch(58.54% 0.2041 277.117)
Tintas Claras
#767FF5#8B96F8#A1ADFA#B9C2FC#D1D8FD
Sombras
#5154C6#40439D#303376#202351#12142E
Contraste
Los ratios describen pares de colores, no certifican páginas. Texto normal AA 4,5:1 y AAA 7:1. Los pares transparentes se componen sobre el fondo.
| Primer plano \ Fondo | 1 | 2 | 3 | 4 | 5 |
|---|---|---|---|---|---|
1 #6366F1 | 1.00 Falla | 1.18 Falla | 1.23 Falla | 1.42 Falla | 1.49 Falla |
2 #3C69C0 | 1.18 Falla | 1.00 Falla | 1.45 Falla | 1.20 Falla | 1.76 Falla |
3 #8F72EA | 1.23 Falla | 1.45 Falla | 1.00 Falla | 1.74 Falla | 1.22 Falla |
4 #0063A3 | 1.42 Falla | 1.20 Falla | 1.74 Falla | 1.00 Falla | 2.11 Falla |
5 #B27FE0 | 1.49 Falla | 1.76 Falla | 1.22 Falla | 2.11 Falla | 1.00 Falla |
Exportar
Colores Exportados: 5 (Paleta Normal)
:root {
--primary-1: #6366F1;
--primary-2: #3C69C0;
--primary-3: #8F72EA;
--primary-4: #0063A3;
--primary-5: #B27FE0;
}Importar
Pega CSS/SCSS exportado, configuración JSON Tailwind v3, tokens JSON, array o lista con comas/saltos. Once tonos deben ordenarse de claro a oscuro.
Integración
Selección para degradado: 0 / 6
Elige 2–6 colores en el orden deseado. No se recortan colores.
Generación, contraste y exportación locales. No se suben colores.
Herramientas relacionadas
Generador de Paletas de Color
Crea sistemas editables y bloqueables con tonos OKLCH y tokens de diseño útiles.
Opciones
Elige base o modo aleatorio, edita y bloquea antes de mezclar. Las armonías usan desplazamientos perceptuales de matiz; los bloqueos pueden modificarlas. La escala conserva la paleta normal y crea exactamente 50–950; la base no tiene que coincidir con 500. Inspecciona tintas, sombras, cuatro formatos y contraste, y copia o descarga cinco formatos de tokens.
Contraste
Se conserva alfa. El contraste compone fondo y primer plano sobre el fondo opaco elegido; no certifica accesibilidad. Once tonos importados deben descender en luminosidad. Datos locales y almacenamiento opcional. Elige 2–6 colores para enviar al degradado con el idioma actual. Restablecer e importar pueden deshacerse.
