Saltar ao contido principal
LibraTool logoLibraTool

Conversor de cores de balde

Converte cores entre formatos HEX, RGB, HSL, HSV e CMYK al instante. Inclúe unha escala de luminosidade e mostras predefinidas.

Funciona sen conexión unha vez cargado

Converte un color entre HEX, RGB, HSL, HSV e CMYK — cunha vista previa en vivo e copia de un toque. Todo se executa no seu navegador.

Acepta: HEX (#fff ou #ffffff), RGB (255, 255, 255) ou HSL (360, 100%, 50%)

100%
Predefinidos:
HEX#14B8A6
rgb() · herdanzargb(20, 184, 166)
rgb() · modernorgb(20 184 166)
hsl() · herdanzahsl(173, 80%, 40%)
hsl() · modernohsl(173 80% 40%)
oklch()oklch(70.4% 0.123 182.5)
lab()lab(67.1% -42.9 -2.3)
lch()lch(67.1% 43.0 183.1)
hsv()hsv(173, 89%, 72%)
cmyk()cmyk(89%, 0%, 10%, 28%)
Valores RGB20, 184, 166

Contraste WCAG

En fondo branco

2,49:1

Fallou

En fondo negro

8,44:1

AAA
🖨️ Para impresión: Estes valores CMYK (89%, 0%, 10%, 28%) son unha aproximación estándar de sRGB→CMYK para referencia. Para obter o color de impresión exacto, usa o perfil ICC da túa impresora ou una proba impresa — a CMYK de pantalla non pode coincidir con todas as tinta/papeis.

Escala de luminosidade

Fai clic en calquera mostra para cambiar a ese ton

Usos habituais

  • Converte Cores para Deseño WebObtén valores HEX, RGB e HSL para calquera cor — listo para pegar en CSS ou Tailwind.
  • Converte Cores para Impresión (CMYK)Converte cores de pantalla (HEX/RGB) en valores CMYK para usar en deseño de impresión e impresión profesional.
  • Constrúe Paletas de Cores para Sistemas de DeseñoConverte cores de marca en todos os formatos e xera escalas de luminosidade consistentes para un sistema de deseño completo.
  • Comprobar Contraste de Cor para AccesibilidadeConverter cores para obter valores RGB para usar en ferramentas de relación de contraste — cumprimento WCAG para deseño accesible.
  • Converter Cores para FigmaObter os valores exactos HEX e RGB para pegar en selectores de cor Figma e sistemas de fichas de deseño.

Como funciona

Toda a lóxica de conversión é JavaScript escrito a man que se executa enteiramente no teu navegador — sen biblioteca, sen chamada a servidor. A ferramenta analiza a túa entrada, encamíñaa a través dunha cadea de funcións matemáticas puras e produce simultaneamente once formatos de saída, incluíndo os modernos espazos CSS Color 4 oklch() e lab().

  1. 1
    Análise flexible de entrada
    Un analizador personalizado acepta hexadecimal (3, 4, 6 ou 8 díxitos), rgb()/rgba(), hsl()/hsla() tanto na sintaxe de comas herdada como na sintaxe moderna de espazos, e triplos numéricos soltos. Os valores alfa como decimais ou porcentaxes normalízanse ao rango 0–1 antes de que comece calquera conversión.
  2. 2
    RGB como eixe de conversión
    Cada formato aceptado resólvese primeiro nun triplo RGB canónico. A partir desa única representación, a ferramenta despráguese: HSL e HSV usan as fórmulas estándar de min/max/croma; CMYK derívase atopando a canle chave; e a linearización sRGB (a curva gamma por tramos definida en IEC 61966-2-1) aplícase antes dos cálculos do espazo perceptual.
  3. 3
    Espazos de cor perceptuais calculados desde cero
    oklch() calcúlase usando as matrices de referencia 3×3 de Björn Ottosson (espazo de raíz cúbica LMS). lab() e lch() usan a adaptación cromática de Bradford para converter do punto branco D65 a D50, o que coincide con como CSS Color 4 define lab(). Estas son as mesmas fórmulas usadas nos motores de renderización dos navegadores — implementadas aquí sen ningunha dependencia externa.
  4. 4
    Contraste WCAG e escala de luminosidade
    A luminancia relativa calcúlase segundo a fórmula WCAG 2.1 (R, G, B linearizados ponderados 0,2126/0,7152/0,0722) e a proporción de contraste contra branco e negro clasifícase como AA-grande, AA, AAA ou Fallo. Xérase unha franxa de nove pasos de luminosidade avanzando a canle de luminosidade HSL do 10% ao 90%, permitíndoche facer clic en calquera mostra para converter esa tonalidade.

Ferramentas relacionadas

Preguntas frecuentes