Generador de matices y sombras
A partir de un color, obtén sus matices (hacia el blanco), sombras (hacia el negro) y tonos (hacia el gris), además de una escala 50–950, con el código en HEX, RGB, HSL, CSS, SCSS, JSON o Tailwind.
Haz clic en una muestra para copiar su código HEX. La imagen PNG lleva una pequeña firma KSPNAI abajo a la derecha.
Todo se calcula en tu navegador: no se envía nada.
Sobre esta herramienta
El generador de matices y sombras lleva un color en tres direcciones: los matices, añadiendo blanco, las sombras, añadiendo negro, y los tonos, añadiendo gris. También obtienes una escala numerada de 50 a 950, práctica para un proyecto web o una identidad visual.
Elige el número de pasos (de 2 a 20) y el modo de mezcla: RGB, la mezcla clásica, u OKLab, que da pasos más regulares a la vista. Haz clic en una muestra para copiar su código y exporta el conjunto en HEX, RGB, HSL, variables CSS, SCSS, JSON o Tailwind, o como imagen PNG.
- Matices, sombras y tonos de un mismo color
- De 2 a 20 pasos por fila
- Mezcla RGB u OKLab
- Escala 50 a 950 al estilo Tailwind
- Código HEX, RGB, HSL, CSS, SCSS, JSON, Tailwind v3 y v4
- Copia de una muestra con un clic, imagen PNG y enlace para compartir
Cómo usarla
- Elige el color base o escribe su código HEX.
- Ajusta el número de pasos y el modo de mezcla.
- Haz clic en una muestra para copiar su código.
- Elige un formato de código y cópialo, o descarga la imagen PNG.
Preguntas frecuentes
¿Qué diferencia hay entre matiz, sombra y tono?
Un matiz es el color mezclado con blanco, una sombra el color mezclado con negro y un tono el color mezclado con gris.
¿Por qué elegir OKLab?
OKLab es un espacio de color pensado para la percepción humana: los pasos entre colores parecen más regulares que con una mezcla RGB.
¿En qué se diferencia del generador de tonos Tailwind?
Aquel solo crea la escala 50–950; aquí obtienes además filas completas de matices, sombras y tonos, con más formatos.
¿Se envían mis colores a algún sitio?
No, todo se calcula en tu navegador.
