Entrada de color
Elige o escribe un color
Color válido.
Herramienta de diseño web
Selector de color
Elige un color con el selector nativo, HEX o controles RGB precisos; copia formatos, explora armonías, consulta tintes y sombras y selecciona texto legible.
Vista previa en directo
Valores de color
Copiar códigos de color
HEX#16735F
RGBrgb(22, 115, 95)
HSLhsl(167.1, 67.9%, 26.9%)
HSVhsv(167.1, 80.9%, 45.1%)
Estimación CMYKcmyk(80.9%, 0%, 17.4%, 54.9%)
Variable CSS--color: #16735F;
Accesibilidad
Contraste del texto
Texto de ejemplo sobre el color seleccionado
Texto blanco5.48:1
Texto negro3.83:1
Color de texto sugeridoUsa texto blanco.
Luminancia relativa0.142
Las relaciones usan la luminancia relativa WCAG. El texto normal necesita 4,5:1 para AA y 7:1 para AAA; el texto grande necesita 3:1 para AA.
Armonía de color
Paleta generada
Elige un modo de armonía y selecciona cualquier muestra para convertirla en el nuevo color base.
Escala de color
Tintes y sombras
Tintes
Sombras
Los tintes se acercan al blanco y las sombras al negro, conservando el matiz y la saturación seleccionados.
Notas del selector de color
HEXHEX es compacto y funciona bien en CSS, tokens de diseño y especificaciones compartidas.
RGBRGB permite controlar directamente los canales rojo, verde y azul para el navegador y canvas.
HSLHSL separa matiz, saturación y luminosidad, algo útil para crear colores de interfaz relacionados.
WCAGLas relaciones de contraste WCAG ayudan a elegir texto negro o blanco legible sobre el fondo seleccionado.
Preguntas frecuentes
¿Puedo usarlo como selector de color HEX?
Sí. Usa el selector nativo o introduce un HEX estricto de tres o seis dígitos y copia HEX, RGB, HSL, HSV, la estimación CMYK o una variable CSS.
¿Funciona el cuentagotas en todos los navegadores?
No. El botón usa la API EyeDropper cuando está disponible y muestra un mensaje claro si no existe o se cancela la selección.
¿Cómo se generan los colores de la paleta?
Las paletas complementaria, análoga, triádica, complementaria dividida, tetrádica y monocromática se calculan localmente con los valores HSL del color elegido.
¿Qué relación de contraste debe alcanzar el texto?
WCAG AA exige 4,5:1 para texto normal y 3:1 para texto grande. AAA exige 7:1 para texto normal.