Generador de paletas de color
Genera sombras, tintes y colores armónicos a partir de un color HEX base, cada uno con su valor HEX copiable.
Generador de paletas de color — Introduce un único color base en HEX y obtén al instante una paleta completa a su alrededor: tintes más claros, sombras más oscuras, el color complementario y un conjunto análogo y triádico. Cada muestra muestra su valor HEX con un botón de copia de un clic. Todo se ejecuta por completo en tu navegador; ningún color se envía a un servidor.
¿Qué es Generador de paletas de color?
El Generador de Paletas de Colores es un creador de esquemas de color gratuito y en línea para diseñadores y desarrolladores front-end que necesitan construir una paleta completa a partir de un solo color base. Introduce un color HEX y al instante deriva tintes más claros, sombras más oscuras, el color complementario y armonías análogas y triádicas mediante matemáticas de color HSL: cada muestra se presenta con su valor HEX y un botón para copiar con un clic. Úsalo para elegir colores de interfaz, crear una escala de tonos claros y oscuros, o encontrar colores de acento que combinen con una marca. Es un generador de paletas HEX, un creador de escalas de tonos y un buscador de colores complementarios, todo en uno.
Cómo usar Generador de paletas de color
- Escribe un color base en el campo Color base (HEX) usando el formato #rrggbb o #rgb, o haz clic en la muestra grande del selector de color para elegirlo visualmente.
- Ajusta Tonos por lado a 2, 3 o 4 para controlar cuántos tintes más claros y sombras más oscuras se generan a cada lado del color base.
- Consulta la sección Tonos claros y oscuros: los tintes más claros aparecen encima del color base y las sombras más oscuras debajo, cada uno etiquetado (Lighter N / Base / Darker N) y mostrado con su valor HEX.
- Consulta la sección Colores armoniosos para ver el complementario, los análogos (+30° / -30°) y los triádicos (+120° / -120°).
- Haz clic en el botón de copiar junto a cualquier muestra (o junto al campo del color base) para copiar ese valor HEX al portapapeles.
Ejemplos
Color complementario del rojo puro
Entrada
#ff0000
Salida
#00ffff
Color triádico del rojo puro
Entrada
#ff0000
Salida
#00ff00
Crear una escala de tonos de marca
Introduce el azul de tu marca (p. ej. #4f86f7) y ajusta Tonos por lado a 4 para obtener cuatro tintes más claros encima y cuatro sombras más oscuras debajo del color base, lo que te da una escala de 9 pasos que puedes copiar color a color en tus tokens de diseño.
Preguntas frecuentes
- ¿Qué formatos de color puedo introducir?
- El color base se introduce como un valor HEX en formato #rrggbb (seis dígitos) o en la forma abreviada #rgb (tres dígitos). Si el valor no es un color HEX válido, aparece el mensaje 'Invalid HEX color' y no se genera ninguna paleta. Todas las muestras de salida se muestran como HEX en formato #rrggbb.
- ¿Cuántos tonos claros y oscuros genera?
- Eliges 2, 3 o 4 tonos por lado. La herramienta produce esa cantidad de tintes más claros (interpolados hacia el blanco) y la misma cantidad de sombras más oscuras (interpoladas hacia el negro), además del color base en el centro.
- ¿Qué colores armoniosos se incluyen?
- Genera el color complementario (matiz rotado 180°), dos colores análogos (+30° y -30°) y dos colores triádicos (+120° y -120°), todos calculados rotando el matiz del color base en HSL.
- ¿Puedo elegir un color visualmente en lugar de escribir el HEX?
- Sí. Haz clic en la muestra grande con el selector de color integrado para elegir un color; el campo HEX se actualiza automáticamente y la paleta se recalcula al instante a medida que lo cambias.
- ¿Se sube mis datos de color a algún sitio?
- No. Todo se ejecuta por completo en tu navegador usando matemáticas de color locales: ningún valor de color se envía nunca a un servidor, por lo que funciona sin conexión y mantiene tu paleta privada.
Herramientas relacionadas
Codificar / decodificar Base32 / Base58
Codifica texto a Base32 (RFC 4648) o Base58 (alfabeto de Bitcoin) y decodifícalo de vuelta, con UTF-8 y en tu navegador.
Codificar / decodificar Base64
Codifica texto a Base64 o decodifica Base64 de vuelta a texto (compatible con UTF-8).
Conversor de mayúsculas y contador
Cambia el uso de mayúsculas y minúsculas del texto y cuenta caracteres, palabras y líneas.
Formateador y minificador de código
Embellece o minifica HTML, CSS y JavaScript en tu navegador, con sangría de 2 espacios, 4 espacios o tabulaciones y compresión de JavaScript con Terser.