Buscador de nombre de color
Dado cualquier color (hex, RGB o selector), encuentra los 8 nombres más cercanos en tres bases de datos: colores CSS 4 con nombre (148, como `cornflowerblue` que puedes usar directo en CSS), la paleta predeterminada de Tailwind v3 (110+ entradas desde `slate-50` hasta `rose-700`) y la encuesta de colores XKCD (los nombres más comunes de un estudio con 222 mil participantes). La distancia se mide en OKLab — un espacio perceptualmente uniforme — así que el ranking coincide con cómo el ojo humano percibe la similitud, a diferencia de la distancia euclidiana RGB que sobre-pondera cambios de luminosidad.
- dodgerblue#1e90ff · ΔE 0.0363
- royalblue#4169e1 · ΔE 0.0668
- cornflowerblue#6495ed · ΔE 0.0697
- mediumslateblue#7b68ee · ΔE 0.0871
- steelblue#4682b4 · ΔE 0.1011
- mediumpurple#9370db · ΔE 0.1131
- slateblue#6a5acd · ΔE 0.1140
- lightslategray#778899 · ΔE 0.1564
Distancia euclidiana OKLab — perceptualmente uniforme. Menor es más cercano.
Cómo usar
- Introduce un hex (`#3b82f6`, `3b82f6`, `#36e`), `rgb(59, 130, 246)` o usa el selector.
- Cambia entre las bases CSS, Tailwind y XKCD.
- Copia un nombre para usarlo directamente en tu CSS o configuración de Tailwind.
Preguntas frecuentes
- ¿Por qué OKLab y no distancia RGB?
- La distancia RGB pura da rankings engañosos — un 10% de cambio de brillo en colores oscuros vale igual que en colores brillantes, pero nuestros ojos son mucho más sensibles a tonos medios. OKLab (de Björn Ottosson, 2020) está calibrado para uniformidad perceptual, así que 'más cercano' realmente significa 'se ve más parecido'.
- ¿Qué es la encuesta XKCD?
- En 2010, Randall Munroe encuestó a 222 500 personas pidiéndoles nombrar 5 colores aleatorios cada una. Los nombres con más consenso forman una paleta útil, usada incluso en librerías como matplotlib. Incluye nombres pintorescos como 'puke green' (no en nuestro top 60).
- ¿Por qué solo 8 resultados?
- Más allá del rango 8, las distancias son tan grandes que 'más cercano' pierde sentido. Si necesitas la lista completa, el algoritmo es simple distancia euclidiana OKLab.
Herramientas relacionadas
Exportador de Tokens de Color
Define una paleta de colores una vez, exporta a CSS custom properties, configuración Tailwind, SCSS, LESS, JSON de design tokens, SwiftUI Color o `colors.xml` de Android. Vista previa de swatches en vivo.
Paleta de Colores Tailwind
La paleta por defecto completa de Tailwind CSS — 22 matices × 11 sombras, 50 a 950 — click para copiar como clase Tailwind, HEX o rgb().
Selector de Color OKLCH
Elige colores en el espacio OKLCH perceptualmente uniforme (luminosidad · croma · matiz) — y ve si cada elección cabe dentro del gamut de pantalla sRGB.
Generador de Gradientes CSS
Crea gradientes CSS lineales o radiales con varias paradas de color y copia el código.
Colores Nombrados de CSS
Los 147 colores nombrados CSS / X11 con HEX, RGB y muestra en vivo — buscables y agrupados por matiz.
Interpolación de Color / Pasos de Gradiente
Elige dos colores hex, obtén N pasos intermedios discretos — en sRGB, linear RGB, OKLab o HSL — con easing opcional.