Vés al contingut principal
LibraTool logoLibraTool

Convertidor de colors de franc

Converteix colors entre formats HEX, RGB, HSL, HSV i CMYK instantàniament. Inclou una escala de lluminositat i mostres predefinides.

Funciona sense connexió un cop carregat

Converteix un color entre HEX, RGB, HSL, HSV i CMYK — amb una vista prèvia en viu i còpia d'un toc. Tot s'executa al teu navegador.

Accepta: HEX (#fff o #ffffff), RGB (255, 255, 255) o HSL (360, 100%, 50%)

100%
Predefinits:
HEX#14B8A6
rgb() · hereditarirgb(20, 184, 166)
rgb() · modernrgb(20 184 166)
hsl() · hereditarihsl(173, 80%, 40%)
hsl() · modernhsl(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%)
Valors RGB20, 184, 166

Contrast WCAG

Sobre fons blanc

2,49:1

Fallit

Sobre fons negre

8,44:1

AAA
🖨️ Per a impressió: Aquests valors CMYK (89%, 0%, 10%, 28%) són una aproximació estàndard de sRGB→CMYK com a referència. Per a color d'impressió precís, utilitza el perfil ICC de la teva impressora o una prova impresa — el CMYK de pantalla no pot coincidir amb cada tinta/paper.

Escala de lluminositat

Feu clic a qualsevol mostra per canviar a aquell to

Usos habituals

  • Converteix colors per a web designObtingueu valors HEX, RGB i HSL per a qualsevol color: preparats per enganxar a CSS o Tailwind.
  • Converteix colors per imprimir (CMYK)Convertiu colors de pantalla (HEX/RGB) a valors CMYK per usar-los en disseny d'impressió i impressió professional.
  • Creeu paletes de colors per a sistemes de dissenyConvertiu colors de marca en tots els formats i creeu escales de lluminositat coherent per a un sistema de disseny complet.
  • Comproveu el contrast de color per a l'accessibilitatConvertiu colors per obtenir valors RGB per a l'ús en eines de proporció de contrast — conformitat WCAG per a disseny accessible.
  • Convertiu colors per a FigmaObteniu els valors HEX i RGB exactes per enganxar als selectors de color de Figma i sistemes de tokens de disseny.

Com funciona

Tota la lògica de conversió és JavaScript escrit a mà que s'executa completament al teu navegador — sense biblioteca, sense crida al servidor. L'eina analitza la teva entrada, l'encamina a través d'una cadena de funcions matemàtiques pures, i produeix simultàniament onze formats de sortida incloent-hi els espais moderns de CSS Color 4 oklch() i lab().

  1. 1
    Anàlisi flexible de l'entrada
    Un analitzador personalitzat accepta hexadecimal (3, 4, 6 o 8 dígits), rgb()/rgba(), hsl()/hsla() tant en sintaxi antiga de comes com en sintaxi moderna d'espais, i triplets numèrics nus. Els valors alfa com a decimals o percentatges es normalitzen al rang 0–1 abans que comenci qualsevol conversió.
  2. 2
    RGB com a concentrador de conversió
    Cada format acceptat es resol primer a un triplet RGB canònic. A partir d'aquesta única representació, l'eina es ramifica: HSL i HSV utilitzen les fórmules estàndard de mín/màx/croma; el CMYK es deriva trobant el canal clau; i la linearització sRGB (la corba gamma per trams definida a l'IEC 61966-2-1) s'aplica abans dels càlculs d'espai perceptual.
  3. 3
    Espais de color perceptuals calculats des de zero
    oklch() es calcula utilitzant les matrius de referència 3×3 de Björn Ottosson (espai d'arrel cúbica LMS). lab() i lch() utilitzen adaptació cromàtica de Bradford per convertir del punt blanc D65 a D50, cosa que coincideix amb com CSS Color 4 defineix lab(). Aquestes són les mateixes fórmules utilitzades en els motors de renderització dels navegadors — implementades aquí sense cap dependència externa.
  4. 4
    Contrast WCAG i escala de lluminositat
    La luminància relativa es calcula segons la fórmula WCAG 2.1 (R, G, B linearitzats ponderats 0,2126/0,7152/0,0722) i la ràtio de contrast contra el blanc i el negre es qualifica AA-gran, AA, AAA, o Suspès. Una franja de nou passos de lluminositat es genera avançant el canal de lluminositat HSL del 10% al 90%, permetent-te fer clic a qualsevol mostra per convertir aquell to.

Eines relacionades

🎨

Selector de color i generador de paletes

Tria colors, converteix entre HEX/RGB/HSL i genera paletes harmonioses.

Prova-ho
🎨

Generador de colors aleatoris

Genera colors aleatoris d'un en un o com una paleta de cinc, bloqueja els que t'agradin, copia els valors HEX, RGB o HSL i exporta la paleta com a PNG o CSS.

Prova-ho
🎨

Generador de paleta de colors

Genera paletes de colors complementàries, anàlogues, triàdiques i monocromàtiques a partir de qualsevol color base. Copia els codis hexadecimales amb un clic.

Prova-ho

Preguntes freqüents