Cuantizar un color al tono más cercano de una paleta
#42A5F5 comparado con #000, #369, #ffffff y #3fa7f2 se ajusta a #3fa7f2, en la posición 3, con una distancia al cuadrado de 22. Mantenga los colores elegidos dentro del conjunto que permite su marca, su dispositivo o su formato. Gratis en su navegador.
- Gratis
- Funciona en su navegador
- Sin registro
- Sus datos no salen de su equipo
Ejecutar — gratis
Ejemplo resuelto
- Color
- #42A5F5
- Paleta
- #000, #369, #ffffff, #3fa7f2
- Color
- #42a5f5
- Color cuantizado
- #3fa7f2
- Índice de la paleta
- 3
- Distancia al cuadrado
- 22
Cuantice un color con una paleta fija cuando una imagen indexada, un tema de terminal, un controlador LED, un conjunto de tokens de diseño o un formato de exportación restringido solo admita colores aprobados. Indique un color hexadecimal de origen y una paleta ordenada. La capacidad valida cada valor, compara distancias RGB exactas y devuelve el color normalizado más cercano, su índice desde cero y la distancia al cuadrado. En caso de empate siempre selecciona la primera entrada, por lo que cada ejecución ofrece el mismo resultado.
Prepare una paleta fija de forma deliberada
La cuantización de color comienza con los tonos que el destino puede almacenar o mostrar realmente. Colóquelos en el array de la paleta en un orden estable e intencionado, con notación #RGB o #RRGGBB. Las formas abreviadas se expanden antes de compararlas y el uso de mayúsculas o minúsculas no modifica el resultado.
El color de origen sigue la misma notación. Una paleta puede contener entre una y 256 entradas, suficiente para pequeños conjuntos de marca, colores de terminal, tablas clásicas de imágenes indexadas, selecciones de hilo de bordado y numerosos mapas de color para dispositivos. El orden solo importa cuando dos entradas están a la misma distancia del origen.
En ese caso gana la primera. Esta regla expresa una preferencia sin cambiar los colores y hace predecibles los empates. Mantenga la misma paleta en todo un lote si necesita una salida indexada coherente.
Si distintos trabajos reordenan la paleta, el índice devuelto puede variar aunque el color elegido sea idéntico. El validador rechaza arrays vacíos o demasiado grandes, prefijos ausentes, canales alfa, dígitos no válidos y entradas que no sean cadenas, en lugar de adivinar la intención.
Comprenda el cálculo determinista de la distancia
Cada color aceptado se amplía a seis dígitos hexadecimales y se descompone en valores de los canales rojo, verde y azul entre 0 y 255. El algoritmo resta cada canal de la paleta al canal correspondiente del origen, eleva al cuadrado las tres diferencias y las suma. Se elige la entrada cuyo total es menor.
Se trata de una distancia euclídea ordinaria en el espacio RGB codificado, elegida para una conversión indexada transparente y reproducible, no para simular la percepción visual. La comparación solo actualiza el candidato cuando la distancia es estrictamente menor, de modo que un empate nunca sustituye una opción anterior. Este detalle garantiza un criterio estable incluso con paletas simétricas o entradas duplicadas.
Qué puede hacer con ella
Crear datos de imagen indexada
Asigne píxeles muestreados a posiciones de una tabla de colores fija antes de escribir una representación indexada.
Aplicar los colores de marca
Ajuste cualquier color seleccionado al miembro más cercano de una paleta aprobada del sistema de diseño.
Adaptarse a hardware limitado
Elija el valor RGB compatible más próximo para LED, pantallas, terminales u otros dispositivos con colores restringidos.
Preguntas frecuentes
¿Qué formatos de color se admiten?
El origen y cada entrada de la paleta deben usar notación hexadecimal #RGB o #RRGGBB. Se rechazan los canales alfa y los valores sin prefijo.
¿Cómo se selecciona el color más cercano?
El algoritmo minimiza la suma de las diferencias al cuadrado de los canales rojo, verde y azul en el espacio RGB codificado.
¿Qué ocurre si dos colores están igual de cerca?
Gana la entrada que aparezca primero en la paleta, lo que garantiza un resultado determinista.
¿El índice de la paleta comienza en cero?
Sí. La primera entrada tiene el índice 0, la segunda el índice 1 y así sucesivamente.
¿Se trata de una comparación de color perceptual?
No. Utiliza distancia euclídea RGB directa para una salida indexada sencilla, exacta y reproducible, en lugar de un modelo perceptual.
Herramientas relacionadas
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/quantize-to-palette \
-H "Authorization: Bearer $KIT_KEY" \
-H "Content-Type: application/json" \
-d '{"color":"#42a5f5","palette":["#000000","#336699","#ffffff"]}'const res = await fetch("https://api.kit.forhosting.com/color/quantize-to-palette", {
method: "POST",
headers: {
"Authorization": `Bearer ${process.env.KIT_KEY}`,
"Content-Type": "application/json"
},
body: JSON.stringify({
"color": "#42a5f5",
"palette": [
"#000000",
"#336699",
"#ffffff"
]
})
});
const { task_id } = await res.json();import os, requests
res = requests.post(
"https://api.kit.forhosting.com/color/quantize-to-palette",
headers={"Authorization": f"Bearer {os.environ['KIT_KEY']}"},
json={
"color": "#42a5f5",
"palette": [
"#000000",
"#336699",
"#ffffff"
]
},
)
task_id = res.json()["task_id"]<?php
$res = file_get_contents("https://api.kit.forhosting.com/color/quantize-to-palette", false, stream_context_create([
"http" => [
"method" => "POST",
"header" => "Authorization: Bearer " . getenv("KIT_KEY") . "\r\nContent-Type: application/json",
"content" => '{"color":"#42a5f5","palette":["#000000","#336699","#ffffff"]}',
],
]));
$task = json_decode($res, true);body := bytes.NewBufferString(`{"color":"#42a5f5","palette":["#000000","#336699","#ffffff"]}`)
req, _ := http.NewRequest("POST", "https://api.kit.forhosting.com/color/quantize-to-palette", 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": "#42a5f5",
"palette": [
"#000000",
"#336699",
"#ffffff"
]
}Ejemplo de respuesta
{
"task_id": "tsk_a1b2c3d4e5f6a1b2c3d4e5f6",
"type": "color.quantize_to_palette",
"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.
Límites
max_items | 256 |
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. |
Notas técnicas
Comprenda el cálculo determinista de la distancia
El valor distance_squared devuelto es exactamente ese entero; no hace falta calcular una raíz cuadrada porque esta no puede alterar cuál de las distancias no negativas es la menor. Es rápida, no depende del entorno y ofrece la misma respuesta en el navegador y mediante la API. El resultado también incluye el color de origen normalizado y palette_index desde cero, para escribir directamente un índice y conservar a la vez el hexadecimal seleccionado en registros, vistas previas o validaciones posteriores.
Use el resultado con seguridad en un flujo indexado
Los índices comienzan en cero, como es habitual en arrays y procesos de imagen. Un valor de cero significa que el origen ya estaba en la paleta, mientras que uno mayor indica más desplazamiento entre canales. Su aplicación puede fijar un máximo adecuado para su ámbito y rechazar conversiones excesivas, aunque esta capacidad siempre devuelve la entrada válida matemáticamente más cercana, sin imponer un umbral arbitrario. Para procesar varios colores, aplique la misma operación pura a cada elemento con la misma paleta ordenada. Para una consulta individual, utilice quantized_color donde el destino espere el valor hexadecimal elegido. Para almacenamiento indexado, emplee palette_index como posición estable dentro de la paleta exacta enviada en la solicitud. Conserve la paleta junto a los índices almacenados: un índice deja de tener un significado cromático independiente si la paleta se sustituye o reordena. distance_squared sirve para controles de calidad. No intervienen red, azar, fecha, estado oculto ni modelos adaptativos; una entrada idéntica genera el mismo JSON.
Preguntas técnicas
¿Cuánto cuesta una solicitud API?
Cada solicitud API cuesta $0.002. La versión para navegador ejecuta localmente la misma lógica determinista.