Haz clic en un color para copiar su HEX
Este generador de tonos y matices crea variaciones más claras y más oscuras de cualquier color. Elige un color base y obtén su escala de matices (tints, mezclados con blanco) y tonos (shades, mezclados con negro), con los códigos HEX listos para copiar. Perfecto para crear estados hover, bordes y jerarquía visual. Funciona en tu navegador, sin registro y en español.
Cómo generar tonos y matices
- Elige tu color base con el selector o escribiendo su HEX.
- Se generan automáticamente las dos escalas: más claros y más oscuros.
- Haz clic en cualquier color para copiar su código HEX.
¿Para qué sirven los tonos y matices?
A partir de un solo color de marca puedes construir toda una gama coherente: un matiz claro para fondos, el color base para botones, y un tono oscuro para el estado hover o los bordes. Es la base de cualquier sistema de diseño. Para combinar colores distintos usa nuestro generador de paletas, y para convertir formatos, el conversor de color HEX, RGB y HSL.
Preguntas frecuentes
¿Qué diferencia hay entre un tono y un matiz?
Un matiz (tint) es el color mezclado con blanco, más claro. Un tono oscuro (shade) es el color mezclado con negro. Ambos parten del mismo color base.
¿Cómo elijo el color para un estado hover?
Suele funcionar bien un tono ligeramente más oscuro que el base para el hover de un botón. Aquí lo tienes a un clic.
¿Se envían mis datos a algún servidor?
No. Todo se calcula en tu navegador.
¿Te ha sido útil este contenido? Puedes invitarme a un café para ayudar a mantener el proyecto.
Invítame a un café
