Generador de Tonos y Matices de Color

Genera matices y tonos de cualquier color base.

Esta herramienta se ejecuta completamente en tu navegador. Tus archivos nunca se suben a un servidor.

Tints (mixed with white)

#d8e6fd

#b1cdfb

#89b4fa

#629bf8

Base

#3b82f6

Shades (mixed with black)

#2f68c5

#234e94

#183462

#0c1a31

Introduce un color base para generar cuatro matices más claros (mezclados con blanco) y cuatro tonos más oscuros (mezclados con negro) — útil para crear una escala de color coherente en diseño de interfaces.

Preguntas Frecuentes

¿Cuál es la diferencia entre un matiz y un tono?
Un matiz es un color mezclado con blanco (más claro); un tono es un color mezclado con negro (más oscuro) — juntos forman una escala de color.
¿Cuántos pasos genera esto?
Cuatro matices, el color base y cuatro tonos — nueve pasos en total, similar a una escala de color de interfaz típica de 50 a 900.
¿Para qué se usan los tonos y matices?
Se usan habitualmente para estados hover/activo, bordes, fondos y combinaciones de texto sobre fondo en un sistema de diseño.