Selector de color online
Consigue cualquier tono que imagines y copia su valor HEX, RGB, HSL o RGBA con un solo toque. Todo ocurre aquí, en la página: sin cuentas, sin subidas y sin que nada salga de tu dispositivo.
Cómo funciona el selector de color
Elige un tono
Desliza la barra de arcoíris hasta la familia que quieras (rojo, turquesa, violeta) y luego ajusta el brillo y la saturación arrastrando dentro del cuadro grande.
Afínalo
Escribe un código conocido directamente en el campo Hex, RGB o HSL y el selector salta a él. Baja el control de opacidad para obtener valores RGBA translúcidos.
Copia y pega
Pulsa copiar junto al formato que necesite tu proyecto. Pégalo en tu CSS, en un archivo de diseño o en tu código y sigue trabajando.
Pensado para diseñadores y desarrolladores
Todos los formatos en un sitio
Hex para CSS, RGB para trabajar con canvas, HSL cuando quieras retocar la luminosidad y RGBA cuando necesites transparencia. Míralos todos de un vistazo y cambia sin calcular a mano.
Nada que instalar
Olvídate del programa de diseño pesado cuando solo necesitas una muestra rápida. El selector carga al instante, sigue funcionando sin red y nunca te pide registrarte.
Privado por diseño
Los colores se calculan localmente con matemáticas simples en tu navegador. No se sube ninguna imagen, no se registra ningún valor y no hay seguimiento de lo que eliges.
Entender los códigos de color
Un color en pantalla son en realidad tres números: cuánta luz roja, verde y azul mezclar. Los formatos de abajo son solo maneras distintas de escribir esa misma receta, y este selector los mantiene sincronizados para que uses el que espere tu herramienta.
Hex
El código de seis caracteres que se ve por todas partes en diseño web, como #f59e0b. Cada par es un canal (rojo, verde, azul) escrito en base 16, de 00 (nada) a ff (máximo). La versión de ocho dígitos añade un par de alfa para la opacidad.
RGB y RGBA
Los mismos tres canales escritos como números normales de 0 a 255, por ejemplo rgb(245, 158, 11). RGBA añade un cuarto valor de 0 a 1 para la transparencia, útil para superposiciones, sombras y efectos de cristal.
HSL
Una forma más humana de describir el color: el tono como un ángulo en la rueda (0–360°) y luego la saturación y la luminosidad como porcentajes. Como la luminosidad tiene su propio control, HSL facilita crear una serie de tonos claros y oscuros a partir de un mismo tono.
Preguntas frecuentes
¿El selector de color es realmente gratis?
Sí, por completo. No hay muro de pago, ni marca de agua en lo que copias, ni límite de colores. Nunca necesitas una cuenta.
¿Se envían mis colores a algún sitio?
No. Cada valor se calcula con JavaScript dentro de tu propia pestaña. Nada de lo que eliges se sube, se guarda en un servidor ni se comparte con nadie.
¿Puedo pegar un código que ya tengo?
Claro. Escribe o pega un valor hex, RGB o HSL en su campo y pulsa Intro: el cuadro y los controles se ajustan para que sigas desde ahí.
¿Qué es el botón de cuentagotas?
En los navegadores que admiten el cuentagotas nativo de pantalla (Chrome y Edge recientes) aparece un botón para tomar el color de cualquier píxel de tu pantalla. Si tu navegador no lo admite, el botón permanece oculto.
¿Cómo consigo un color transparente?
Arrastra el control de opacidad a cuadros situado bajo la barra de tono. Cuando la opacidad baja del 100%, la herramienta muestra un valor RGBA y un hex de ocho dígitos listo para tu CSS.
¿Funciona en el móvil?
Sí. El cuadro y los controles responden al tacto, así que puedes arrastrar con el dedo y copiar códigos en el móvil igual que en el ordenador.