tool hub Centro de herramientas

Color Picker

Color Picker — se ejecuta en el navegador. No se guardan datos.

Se ejecuta en el navegador Sin registro Gratis


Selector de color

Elija un color con el selector nativo para ver HEX, RGB y HSL a la vez. Si solo necesita RGB↔HEX, use el conversor RGB–HEX.

Cómo usar

  1. Pulse Elegir color y elija en el selector nativo del sistema. El valor por defecto es #1a5cff.
  2. La muestra de abajo y los campos HEX, RGB y HSL se actualizan juntos.
  3. Editar HEX también actualiza RGB y HSL. El HEX corto de 3 dígitos se expande a 6 dígitos.
  4. Copiar HEX pone el HEX actual en el portapapeles.
  5. Restablecer recupera el azul por defecto. Los campos RGB y HSL son de solo lectura.

Conceptos clave

El selector de color muestra un color elegido a ojo como HEX, RGB y HSL a la vez. HEX es el más habitual en CSS; RGB es 0–255 separado por comas; HSL es ángulo de tono, saturación y luminosidad. Un bloqueo interno de actualización evita que el selector y el campo HEX se pisen. La IU nativa del selector se ve distinta en cada sistema. El recuadro de muestra usa el HEX actual como fondo para ver el contraste al momento. El campo HEX tiene como máximo 7 caracteres.

Esta pantalla se centra en elegir y comprobar HSL. Para cambiar números RGB con rapidez, use la conversión RGB HEX; para muestrear un píxel de una foto, use la extracción de color de imagen. Los valores de color no se guardan en un servidor. No hay campos para editar RGB o HSL a mano; los números son solo de visualización. Al salir de la página se pierde el color elegido, así que copie HEX si lo necesita.

Ejemplo

El #1a5cff por defecto es RGB 26, 92, 255 y HSL unos 224°, 100 %, 55 %. Pegue un HEX de guía de marca en el campo y el selector y la muestra siguen. Tras elegir un color de botón o enlace, copie HEX a una hoja de estilos. #fff se expande a #ffffff con RGB 255, 255, 255. Para un botón de fondo oscuro, compruebe en la muestra que la luminosidad HSL no sea demasiado baja.

Relacionado: conversor RGB HEX · extracción de color de imagen

Preguntas frecuentes

¿Aparecen HEX, RGB y HSL en el selector de color?

Sí. Cambiar el selector o HEX actualiza los tres campos. RGB y HSL son solo de visualización y no se editan al momento. Tener tres notaciones en un sitio es práctico para docs de tokens de diseño. HSL sirve para juzgar ajustes de saturación.

¿Puedo escribir un código HEX directamente?

Sí. Hasta 7 caracteres incluido #. Los códigos de 3 dígitos como #abc se expanden a #aabbcc. Se ignoran caracteres no válidos. Una cadena de longitud incorrecta puede fallar el análisis y conservar el color anterior. Solo es fiable el hex de 6 dígitos.

¿En qué se diferencia el conversor RGB HEX del selector de color?

El conversor cambia campos RGB/HEX; esta página tiene un selector nativo más HSL y una muestra. Use el conversor solo para números; use esta herramienta para elegir a ojo. El conversor no tiene selector. Use esta página si necesita la muestra y HSL.

¿Dónde está el botón Copiar HEX?

Copiar HEX abajo. Los navegadores compatibles ponen #rrggbb en el portapapeles. Si el permiso del portapapeles está bloqueado, copiar puede fallar en silencio. Entonces arrastre usted el campo HEX.

¿Puedo editar los valores HSL al momento?

El campo HSL es de solo lectura. Para acertar tono, saturación y luminosidad como números, use el selector o cambie HEX. Mover la rueda del selector actualiza el ángulo de tono HSL. No hay entrada numérica de saturación/luminosidad.

¿El color elegido se guarda en un servidor?

No se guarda ni se envía. Actualizar vuelve al color por defecto. Actualizar vuelve a #1a5cff. Para reunir varios colores, anote aparte los HEX copiados.

Color Picker imagen de portada
La entrada no se envía al servidor y desaparece al cerrar la página.

Última revisión: 2026-09-04