Generador de color aleatorio
Colores y códigos al azar para diseño y código.
Haz clic en un código para copiarlo. Haz clic en el candado para conservar un color al generar de nuevo.
- Códigos HEX, RGB o HSL
- Paletas pastel y oscuras
- Bloquea colores, vuelve a girar el resto
Cómo generar colores al azar
- Elige cuántos colores y un formato de código.
- Elige una paleta aleatoria, pastel u oscura.
- Haz clic en una muestra para copiar su código, o bloquéala antes de generar más.
HEX, RGB y HSL comparados
Los tres formatos describen exactamente el mismo color. Cuál necesitas depende de dónde vayas a pegarlo.
| Formato | Se ve así | Ideal para |
|---|---|---|
| HEX | #3B82F6 | CSS, herramientas de diseño, compartir rápido |
| RGB | rgb(59, 130, 246) | CSS, código que mezcla o desvanece colores |
| HSL | hsl(217, 91%, 60%) | Ajustar un color a mano: primero el tono, luego lo intenso, luego lo claro |
HSL suele ser el más fácil de ajustar tú mismo, ya que deslizar el número de claridad más claro u oscuro mantiene el mismo tono, algo que HEX y RGB hacen más difícil a simple vista.
Aleatoria, pastel y oscura, en números
Cada modo elige de una franja distinta de la rueda de color en lugar de solo cambiar el tono.
| Modo | Rango de saturación | Rango de claridad |
|---|---|---|
| Aleatoria | 40 a 100 % | 25 a 75 % |
| Pastel | 35 a 60 % | 75 a 88 % |
| Oscura | 35 a 70 % | 12 a 28 % |
El tono siempre se elige del rango completo de 0 a 359 en cada modo, así que pastel y oscura igualmente cubren cada familia de color, solo que más claros o más oscuros.
Para qué se usan los colores al azar
- Inspiración rápida de diseño cuando no sabes qué color de marca o de tema elegir.
- Colores provisionales para wireframes, gráficos y maquetas de interfaz antes de elegir una paleta real.
- Generar fondos de avatar, etiquetas o colores de categoría en una app.
- Proyectos de arte y manualidades, como un color al azar de inspiración para un boceto diario.
Preguntas frecuentes sobre Generador de color aleatorio
¿Cuál es la diferencia entre las paletas?
Aleatoria cubre toda la rueda de color. Pastel mantiene la claridad y la saturación suaves para fondos delicados. Oscura mantiene los colores con poca claridad para temas oscuros y texto de contraste.
¿Cómo mantengo un color que me gusta?
Haz clic en el icono de candado de una muestra. Las muestras bloqueadas conservan su color la próxima vez que generes, así puedes volver a girar solo el resto.
¿Cuál es la diferencia entre HEX, RGB y HSL?
HEX y RGB describen un color por sus cantidades de rojo, verde y azul. HSL lo describe por tono, saturación y claridad, que suele ser más fácil de ajustar a mano.
¿Cómo copio un código de color?
Haz clic en el texto del código bajo cualquier muestra y se copia al portapapeles al instante.
¿Qué rangos usan realmente las paletas?
Aleatoria elige cualquier tono con saturación del 40 al 100 % y claridad del 25 al 75 %. Pastel reduce la claridad al 75-88 %. Oscura reduce la claridad al 12-28 %, con saturación del 35 al 70 % para que los colores se mantengan intensos en lugar de apagados.
¿Van a combinar bien dos colores al azar?
A veces. Esta herramienta elige colores de forma independiente para variedad e inspiración, no crea una paleta ya combinada. Para colores que combinen seguro, genera varios, bloquea los que te gusten y vuelve a girar el resto hasta que el conjunto encaje.
¿Puedo generar solo un color en lugar de un conjunto?
Sí, pon el número en 1 y haz clic en Generar para obtener un solo color al azar en el formato que elijas.
¿Dónde puedo usar un código HEX o RGB una vez que lo tengo?
Pega un código HEX directamente en CSS, Figma, Photoshop o casi cualquier herramienta de diseño. Los valores RGB y HSL funcionan igual en funciones CSS como rgb() y hsl().