Distancia entre color y complementario
La distancia entre color y complementario convierte una relación conocida del círculo cromático en una medida reproducible.
Ejecutar — gratis
Introduzca un color hexadecimal o RGB: la calculadora obtiene su complementario HSL exacto a 180 grados, convierte ambos colores de sRGB a CIELAB D65 e informa de su separación Delta E 76. Un índice normalizado facilita ordenar y comparar resultados, mientras que los códigos hexadecimales, canales RGB y coordenadas Lab permiten revisar cada paso. La validación estricta rechaza entradas incompletas o fuera de rango en vez de modificarlas silenciosamente.
Introduzca un color y defina su complementario de forma coherente
Envíe un color mediante un código hexadecimal de tres o seis dígitos, una expresión rgb(r, g, b) o tres canales RGB separados por comas. El signo de almohadilla inicial y las mayúsculas o minúsculas hexadecimales no cambian el resultado. Los canales RGB deben ser enteros entre 0 y 255; por ello, la sintaxis incorrecta, los porcentajes, los decimales, los canales ausentes y los valores ajenos al intervalo sRGB visible producen una respuesta de entrada no válida. Tras analizar el valor, la calculadora convierte los canales RGB originales a HSL y gira el matiz exactamente 180 grados, conservando la saturación y la luminosidad. Esta definición corresponde al punto clásico opuesto del círculo HSL y hace explícita la operación, sin depender de un criterio artístico oculto. El valor HSL girado vuelve a canales sRGB enteros antes de medirse, igual que los colores representables en pantallas y flujos CSS habituales. Las entradas acromáticas son un caso significativo: como un gris tiene saturación cero, girar su matiz nominal no crea otro color visible. Su complementario sigue siendo el mismo gris y la distancia medida es cero. La misma entrada genera siempre la misma salida porque no intervienen red, azar, reloj, consulta de perfiles ni estado oculto.
Interprete la distancia Lab y el índice de armonía
La respuesta muestra el original normalizado y su complementario como valores hexadecimales de seis dígitos en mayúsculas, canales RGB enteros y coordenadas CIELAB. La conversión linealiza primero los canales sRGB estándar, los transforma mediante la matriz sRGB convencional a CIE XYZ, utiliza el blanco de referencia D65 propio de sRGB y aplica la función de transferencia CIELAB. El campo delta_e_76 es la distancia euclídea entre las dos ternas Lab: cero indica que los colores representados coinciden y un valor mayor señala más separación perceptual según este modelo. Se emplea Delta E 76 de forma deliberada porque este servicio mide un único par determinista sin ocultar ponderaciones de tolerancia sectoriales. harmony_strength transforma la distancia a una escala práctica de 0 a 100: divide Delta E por dos y limita el resultado a 100. Es un indicador comparativo, no una ley universal de belleza. Las etiquetas permiten clasificar: menos de 15 es débil; de 15 a menos de 35, moderada; de 35 a menos de 65, fuerte; y 65 o más, muy fuerte. Los complementarios saturados suelen puntuar alto y los tonos apagados o neutros, más bajo. Conserve delta_e_76 para el dato original y use el índice o la etiqueta en paneles, filtros y reglas sencillas de diseño.
Aplique la métrica con criterio en sistemas de diseño
Esta calculadora resulta útil cuando un generador de paletas, un creador de temas, un sistema de gráficos o una canalización de tokens de marca necesita algo más que el hexadecimal del complementario. Su equipo puede obtener complementarios con una convención estable, ordenar colores de origen según la separación perceptual que producen y guardar las coordenadas Lab junto a los tokens generados para auditarlos. Cada elemento correcto de la API cuesta $0.002, mientras la ejecución en el navegador permite comprobaciones interactivas rápidas. Los errores de validación impiden que cadenas defectuosas se conviertan en datos de paleta aparentemente válidos. No confunda la fuerza de armonía con el contraste accesible: Delta E estima diferencia cromática, mientras que la legibilidad del texto exige calcular contraste de luminancia y considerar tamaño y contexto. Una puntuación muy fuerte tampoco garantiza adecuación a una marca, cultura, estado de interfaz o proceso de impresión. Aquí se trabaja con pantallas sRGB; colores de impresión, tintas directas, gamas amplias y muestras medidas requieren antes una gestión explícita del perfil. Use el resultado como una señal junto al contraste, la jerarquía, el equilibrio de saturación y la revisión humana. Guarde el campo method si necesita reproducibilidad: identifica el giro HSL, CIELAB D65 y Delta E 76, evitando confundir el índice con CIE94, CIEDE2000 u otra regla de complementarios.
Qué puede hacer con ella
Ordenar colores de acento generados
Mida cada color de marca frente a su complementario derivado y priorice los pares con la separación perceptual deseada.
Auditar la generación de tokens
Guarde hexadecimal, RGB, Lab, método y distancia normalizados para reproducir y comprobar después un token complementario.
Enseñar relaciones cromáticas
Muestre por qué los colores saturados y los grises neutros reaccionan de modo distinto al medir el mismo giro de matiz de 180 grados.
Preguntas frecuentes
¿Cómo se calcula el complementario?
El origen pasa de sRGB a HSL, el matiz gira 180 grados, la saturación y la luminosidad se mantienen, y el resultado vuelve a sRGB entero.
¿Qué significa Delta E 76?
Es la distancia recta entre el original y el complementario en CIELAB. Cero significa ausencia de separación Lab; un valor mayor representa más separación perceptual modelada.
¿Cómo se obtiene la fuerza de armonía?
La calculadora divide Delta E 76 entre dos y limita el resultado a 100. Es un índice comparativo coherente, no una valoración objetiva de calidad estética.
¿Una puntuación alta garantiza contraste accesible?
No. La distancia perceptual y el contraste de luminancia responden a preguntas diferentes. Use una calculadora de contraste WCAG para texto y accesibilidad de interfaces.
¿Cuánto cuesta un cálculo mediante la API?
Cada elemento correcto de la API cuesta $0.002. Las entradas no válidas se rechazan con claridad en lugar de ajustarse silenciosamente al intervalo.
Para desarrolladores — acceso por API
Todo lo de esta página está disponible por programación. Esta sección es para equipos que quieren integrarlo en sus sistemas; el resto puede usar la herramienta de arriba sin más.
Endpoint de API
¿Prefiere automatizarlo? Un POST autenticado crea la tarea; el resultado llega por webhook o enlace firmado. La misma capacidad también se ejecuta aquí en la web, por email y desde Telegram — y pronto también desde nuestra app.
Llámela desde su stack
curl -X POST https://api.kit.forhosting.com/color/complement-distance \
-H "Authorization: Bearer $KIT_KEY" \
-H "Content-Type: application/json" \
-d '{"color":"#336699"}'const res = await fetch("https://api.kit.forhosting.com/color/complement-distance", {
method: "POST",
headers: {
"Authorization": `Bearer ${process.env.KIT_KEY}`,
"Content-Type": "application/json"
},
body: JSON.stringify({
"color": "#336699"
})
});
const { task_id } = await res.json();import os, requests
res = requests.post(
"https://api.kit.forhosting.com/color/complement-distance",
headers={"Authorization": f"Bearer {os.environ['KIT_KEY']}"},
json={
"color": "#336699"
},
)
task_id = res.json()["task_id"]<?php
$res = file_get_contents("https://api.kit.forhosting.com/color/complement-distance", false, stream_context_create([
"http" => [
"method" => "POST",
"header" => "Authorization: Bearer " . getenv("KIT_KEY") . "\r\nContent-Type: application/json",
"content" => '{"color":"#336699"}',
],
]));
$task = json_decode($res, true);body := bytes.NewBufferString(`{"color":"#336699"}`)
req, _ := http.NewRequest("POST", "https://api.kit.forhosting.com/color/complement-distance", body)
req.Header.Set("Authorization", "Bearer "+os.Getenv("KIT_KEY"))
req.Header.Set("Content-Type", "application/json")
res, _ := http.DefaultClient.Do(req)Ejemplo de solicitud
{
"color": "#336699"
}Ejemplo de respuesta
{
"task_id": "tsk_a1b2c3d4e5f6a1b2c3d4e5f6",
"type": "color.complement_distance",
"status": "queued",
"_links": {
"result": "/tasks/tsk_…/result"
}
}La API es asíncrona: la llamada devuelve un task_id al instante y el resultado llega por webhook. El polling está limitado a 1 req/s por tarea.
Precio
Precio publicado — sin tokens ni créditos inventados. Una tarea fallida no se cobra.
Errores
| HTTP | Código | Significado |
|---|---|---|
401 | unauthorized | API key ausente o inválida. |
402 | insufficient_balance | El saldo no cubre el precio de la tarea. |
404 | unknown_type | El tipo de tarea no existe. |
429 | rate_limited | Demasiadas peticiones. Use el webhook en vez de sondear. |