Genere una paleta de colores análogos desde un color hexadecimal

El generador convierte el color base a HSL, distribuye los colores solicitados de manera uniforme en una ventana de sesenta grados centrada en el tono original y convierte cada resultado de nuevo a notación hexadecimal normalizada. Una solicitud de un color devuelve el tono base; las paletas mayores incluyen ambos límites de treinta grados. El cálculo determinista sirve para tokens de diseño, gráficos, ilustraciones y procesos de compilación repetibles.

Elija el color base y el tamaño de la paleta

Empiece con un color hexadecimal CSS de tres o seis dígitos, con almohadilla inicial opcional. La notación corta se amplía antes de convertirla, por lo que #36c y #3366cc representan el mismo color inicial y generan la misma salida normalizada. Después elija count, que determina el número exacto de muestras devueltas. Debe ser un entero de al menos uno; cero y los valores negativos se rechazan porque no describen una paleta. Si count es uno, el generador devuelve el tono base sin desplazarlo. Si es dos, devuelve los tonos límite de menos treinta y más treinta grados. Con tres colores, la base queda entre esos límites. Los recuentos superiores añaden intervalos iguales dentro de la misma ventana, sin ampliar la armonía. La saturación y la luminosidad se conservan, de modo que solo cambia el tono. La salida incluye el color base normalizado, el recuento y cada muestra con índice, desplazamiento firmado, ángulo de tono ajustado al círculo y valor hexadecimal en minúsculas.

Comprenda el espaciado uniforme en la rueda cromática

Los colores análogos ocupan posiciones vecinas en una rueda de tonos circular. Esta capacidad usa una ventana fija desde treinta grados por debajo del tono base hasta treinta grados por encima, con una amplitud total de sesenta grados. Para cualquier count superior a uno, el intervalo se calcula dividiendo esa amplitud entre count menos uno. Cinco colores usan así los desplazamientos -30, -15, 0, 15 y 30 grados; cuatro usan -30, -10, 10 y 30. Como el tono es circular, cualquier resultado que cruce cero continúa cerca de trescientos sesenta, en vez de convertirse en un ángulo negativo inválido. El algoritmo interpreta primero los canales RGB, los convierte a HSL, aplica cada desplazamiento y transforma el HSL resultante otra vez a RGB entero y hexadecimal. El redondeo es determinista, por lo que una entrada idéntica produce el mismo JSON. Los grises son un caso válido: al tener saturación cero, el cambio matemático de tono no altera el RGB visible y pueden aparecer valores hexadecimales repetidos.

Aplique la paleta en flujos de producción

Utilice el arreglo generado cuando necesite una familia repetible de colores relacionados y no un contraste intenso. Un sistema de diseño puede asociar los índices con propiedades personalizadas como accent-1 a accent-5 y regenerarlas cuando cambie el color principal de la marca. Un creador de gráficos puede solicitar tantas muestras como series tenga un informe y asignarlas en orden para mantener la cohesión. Las herramientas de ilustración pueden convertir una semilla dirigida artísticamente en colores controlados para rellenos y detalles, aunque los cambios de luminosidad deben realizarse por separado. El resultado también es apropiado para pruebas de instantáneas porque no contiene aleatoriedad, fechas, respuestas de red ni variación de modelos. Conserve el color base y count como fuente de verdad. Antes de usar una muestra para texto, iconos o controles, compruebe el contraste con el fondo real: la armonía análoga no garantiza conformidad WCAG. Cada elemento procesado correctamente mediante API cuesta $0.002; valide count en su interfaz y muestre el mensaje de error si es menor que uno o no es entero.