Buscador de Nombres de Colores
Introduce un color en hex, rgb() o hsl() y encuentra al instante el nombre de color CSS más cercano, con una comparación visual en vivo y algunas alternativas próximas.
🔒 Procesado localmente en tu navegador
Loading…
Cómo usarlo
- Escribe un color en el campo en formato hex, rgb() o hsl(), o elígelo visualmente con el selector de color.
- El nombre de color CSS más cercano aparece al instante, con su propia muestra, nombre y código hex junto al tuyo.
- Consulta la puntuación de distancia para ver cuán cercana es la coincidencia — una distancia de 0 significa una coincidencia exacta.
- Desplázate por la lista de abajo para ver algunos nombres de color más cercanos, ordenados de más próximo a más lejano.
Características
- Acepta los formatos de color hex, rgb() y hsl(), además de un selector de color visual
- Compara con los 148 nombres de color estándar de CSS/X11
- Muestra una comparación en vivo, lado a lado, de tu color y el nombre de color coincidente
- Incluye una puntuación de distancia numérica además de varias alternativas cercanas
- 100 % del lado del cliente — tus colores nunca salen de tu navegador
Preguntas frecuentes
¿Cómo funciona la coincidencia de nombres de color?
Tu color se convierte a RGB y luego se compara con cada nombre de color estándar de CSS usando la distancia euclidiana entre sus valores RGB. El nombre de color con la menor distancia se muestra como la coincidencia más cercana, y los siguientes más cercanos se muestran como alternativas.
¿Con qué nombres de color se compara?
El conjunto estándar de 148 palabras clave de color extendidas de CSS/X11 definidas por el CSS Color Module — los mismos nombres que reconocen los navegadores en CSS, como "tomato", "slateblue" o "rebeccapurple". Es una lista fija y conocida, por lo que solo se encuentra una coincidencia exacta cuando tu color cae exactamente sobre uno de ellos.
¿Por qué los nombres de color aparecen en inglés aunque el sitio esté en mi idioma?
Nombres como "Tomato" o "SlateBlue" son palabras clave literales de CSS, no texto traducible — un navegador solo entiende la ortografía en inglés dentro de una hoja de estilos. Por eso se mantienen en inglés en todos los idiomas, mientras que el resto de la página a su alrededor está totalmente traducido.
¿Qué significa la puntuación de distancia?
Es la distancia en línea recta (euclidiana) entre tu color y el nombre de color en el espacio RGB, donde cada canal va de 0 a 255. Una distancia de 0 es una coincidencia exacta; la distancia máxima posible (de negro a blanco) es de unos 441. Cuanto menor es el número, más cercana es la coincidencia visual.
¿Esta herramienta almacena o sube mis colores?
No. Todo el análisis, la comparación y el cálculo de distancia ocurren localmente en tu navegador con JavaScript sencillo. Nada se envía a un servidor ni se guarda en ningún lugar.