Convertidor de códigos de color
Color Code Converter es una herramienta gratuita en línea que convierte instantáneamente valores de color entre diferentes formatos utilizados en el desarrollo y diseño web. Convierta entre colores HEXADECIMALES (#RRGGBB), RGB (rgb (r, g, b)), RGBA(rgba (r,g,b,a)), HSL(hsl (h,s%,l%)), HSLA y CSS con un solo clic. Ingrese un color en cualquier formato y obtenga todas las demás representaciones al instante. Perfecto para desarrolladores que necesitan traducir valores de color entre CSS, JavaScript, herramientas de diseño y editores de imágenes, así como para diseñadores que desean convertir los resultados del selector de color a formatos compatibles con CSS.
Qué es
Color Code Converter traduce los valores de color entre los diversos formatos utilizados en el diseño digital y el desarrollo web. Diferentes herramientas y contextos usan diferentes notaciones de color, y este convertidor cierra la brecha entre ellos. Formatos de color admitidos: - HEXADECIMAL (#RRGGBB o #RRGGBBAA): El formato de color web más común: una cadena hexadecimal de seis dígitos que representa los canales Rojo, Verde y Azul. Ejemplo: # FF6347 (Tomate) - RGB (rgb (255, 99, 71)): Notación funcional que especifica los valores Rojo, Verde y Azul del 0 al 255. - RGBA (rgba )(255, 99, 71, 0.8)): RGB con un canal alfa para opacidad (0.0-1.0). - HSL (hsl)(9, 100%, 64%)): Matiz (0-360 grados), Saturación( 0-100%), Luminosidad(0-100%). Más intuitivo para que los humanos razonen sobre los colores. - HSLA (hsla(9, 100%, 64%, 0.8)): HSL con canal alfa. - Colores con nombre CSS: 148 nombres estándar como 'tomate', 'cornflowerblue', 'rebeccapurple'. - HSVA, CMYK (conversiones centradas en el diseño) Por qué existen múltiples formatos de color: - HEX es compacto y universalmente compatible con HTML / CSS - RGB coincide con la forma en que las pantallas producen color (luz roja + verde + azul) - HSL es intuitivo: ajusta la luminosidad sin cambiar el tono del núcleo - RGBA / HSLA agrega control de transparencia - Las herramientas de diseño (Figma, Sketch) a menudo usan formatos diferentes a los que requiere el código. Precisión de conversión: Todas las conversiones utilizan fórmulas matemáticas precisas de la especificación CSS Color Module Level 4. Las conversiones HSL RGB RGB HEX HEX no tienen pérdidas para canales de color de 8 bits. Los valores del canal alfa se conservan exactamente.
Cómo usar
- Ingrese su valor de color en cualquier formato compatible en el campo de entrada. Puede escribir un código hexadecimal (#FF6347), un valor RGB (rgb (255,99,71)), un valor HSL (hsl (9,100%, 64%)) o incluso un CSS llamado color (tomate).
- La herramienta detecta automáticamente el formato que ingresaste y muestra todas las demás representaciones en tiempo real. No es necesario hacer clic en un botón de conversión—las actualizaciones ocurren al instante mientras escribes.
- Vea los resultados de conversión en los paneles de salida. Cada panel muestra el nombre del formato, la sintaxis y el valor formateado. Haga clic en cualquier resultado para copiarlo inmediatamente a su portapapeles.
- Usa el selector de colores (icono de cuentagotas) para seleccionar visualmente un color de tu pantalla. El color elegido se convierte inmediatamente a todos los formatos compatibles.
- Verifique la muestra de vista previa de color para confirmar el color real. La vista previa muestra el color sobre fondos claros y oscuros para ayudarle a evaluar la visibilidad.
- Para conversiones rgba/hsla, ajusta el control deslizante de alfa para ver cómo los cambios de opacidad afectan el código hexadecimal de salida (formato de 8 dígitos) y otras representaciones.
Ejemplos
Entrada: HEX: #FF5733
Proceso: FF=255, 57=87, 33=51
Resultado: RGB(255, 87, 51) | HSL(11, 100%, 60%)
Entrada: RGB(0, 128, 255)
Proceso: 0=00, 128=80, 255=FF | H=210, S=100%, L=50%
Resultado: HEX: #0080FF | HSL(210, 100%, 50%)
Búsquedas Relacionadas
La gente también busca: convertidor de código de color, hexadecimal a rgb, rgb a hsl, convertidor de color.
convertidor de código de colorhexadecimal a rgbrgb a hslconvertidor de color
Preguntas Frecuentes
¿Cuál es la diferencia entre los formatos HEX y RGB?
HEXADECIMAL (#FF6347) y RGB(rgb (255, 99, 71)) representan el mismo color pero usan una notación diferente. HEX combina los tres canales de color en un solo número hexadecimal de 6 dígitos (base-16). RGB expresa cada canal por separado como un número decimal del 0 al 255. HEX es más compacto y es el formato predeterminado en la mayoría de las herramientas de diseño y HTML. La notación funcional RGB/HSL es más legible y más fácil de manipular mediante programación en JavaScript (por ejemplo, ajustando la luminosidad en HSL).
¿Debo usar HSL o RGB para mi CSS?
HSL generalmente se prefiere para la manipulación programática del color porque es más intuitivo. Con HSL, puede oscurecer un color reduciendo el porcentaje de luminosidad o cambiar un color cambiando el Tono, sin afectar otros aspectos. Con RGB, crear un tono más oscuro requiere reducir los tres canales proporcionalmente, lo cual es más difícil de razonar. Sin embargo, HEXADECIMAL sigue siendo el más compacto para valores de color estáticos en hojas de estilo.
¿Puedo convertir colores hexadecimales de 8 dígitos (con alfa) a otros formatos?
Sí. los códigos hexadecimales de 8 dígitos (#RRGGBBAA) incluyen el canal alfa. Por ejemplo, # FF634780 representa Tomate con un 50% de opacidad. La herramienta los convierte a notación rgba (). Al convertir de rgba () a hexadecimal, si alfa es menor que 1.0, la salida estará en formato hexadecimal de 8 dígitos. También puede usar el control deslizante alfa para ajustar la transparencia en tiempo real.
¿Cómo convierto CMYK a RGB para uso web?
CMYK (Cian, Magenta, Amarillo, Clave/ Negro)se utiliza para el diseño de impresión. Para convertir CMYK a RGB para web / CSS, use los campos de entrada CMYK (valores 0-100 para cada canal) y la herramienta genera los valores RGB, HEX y HSL equivalentes. Nota: CMYK y RGB tienen gamas de colores diferentes; algunos colores de impresión no tienen un equivalente exacto en la pantalla. La conversión proporciona la aproximación RGB más cercana.
¿La herramienta admite formatos de color CSS4 como LCH o LAB?
La herramienta admite los formatos más utilizados (HEX, RGB, RGBA, HSL, HSLA, colores con nombre). El módulo de color CSS de nivel 4 introdujo LCH, LAB y OKLCH, que ofrecen espacios de color más uniformes desde el punto de vista perceptual. Para la mayoría de las necesidades de desarrollo web, HSL proporciona suficiente uniformidad perceptual. Si necesita específicamente la conversión LCH / LAB, las herramientas dedicadas a la ciencia del color pueden ser más apropiadas.