Hoppa till huvudinnehåll
LibraTool logoLibraTool

Gratis Färgkonverterare

Konvertera färger mellan HEX-, RGB-, HSL-, HSV- och CMYK-format direkt. Inkluderar en ljushetsskala och förinställda färgprov.

Fungerar offline när den väl lästs in

Konvertera en färg mellan HEX, RGB, HSL, HSV och CMYK — med en live förhandsgranskning och kopiera med ett knapptryck. Allt körs i din webbläsare.

Accepterar: HEX (#fff eller #ffffff), RGB (255, 255, 255) eller HSL (360, 100%, 50%)

100%
Förval:
HEX#14B8A6
rgb() · äldrergb(20, 184, 166)
rgb() · modernrgb(20 184 166)
hsl() · äldrehsl(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%)
RGB-värden20, 184, 166

WCAG-kontrast

På vit bakgrund

2,49:1

Underkänt

På svart bakgrund

8,44:1

AAA
🖨️ För tryck: Dessa CMYK-värden (89%, 0%, 10%, 28%) är en standard sRGB→CMYK-approximation för referens. För korrekt utskriftsfärg, använd din skrivares ICC-profil eller ett utskriftstest — skärm CMYK kan inte matcha varje bläck/papper.

Ljushetsskala

Klicka på en färgruta för att byta till den nyanssen

Vanliga användningar

  • Konvertera färger för webdesignFå HEX-, RGB- och HSL-värden för vilken färg som helst - redo att klistra in i CSS eller Tailwind.
  • Konvertera färger för tryck (CMYK)Konvertera skärmfärger (HEX/RGB) till CMYK-värden för användning i tryckdesign och professionell utskrift.
  • Bygg färgpaletter för designsystemKonvertera varumärkesfärger över alla format och generera konsekvent ljushetskalor för ett komplett designsystem.
  • Kontrollera färgkontrast för tillgänglighetKonvertera färger för att få RGB-värden för användning i kontrastförhållandverktyg — WCAG-efterlevnad för tillgänglig design.
  • Konvertera färger för FigmaFå de exakta HEX- och RGB-värdena för att klistra in i Figmas färgväljare och designtokensystem.

Så här fungerar det

All omvandlingslogik är handskriven JavaScript som körs helt i din webbläsare — inget bibliotek, inget serveranrop. Verktyget tolkar din indata, dirigerar den genom en kedja av rena matematikfunktioner, och producerar samtidigt elva utdataformat inklusive de moderna CSS Color 4-rymderna oklch() och lab().

  1. 1
    Flexibel indatatolkning
    En anpassad tolk accepterar hex (3, 4, 6 eller 8 siffror), rgb()/rgba(), hsl()/hsla() i både äldre kommatecknad syntax och modern mellanslagssyntax, samt rena numeriska tripplar. Alfavärden som decimaltal eller procentandelar normaliseras till intervallet 0–1 innan någon omvandling börjar.
  2. 2
    RGB som omvandlingsnav
    Varje accepterat format löses först upp till en kanonisk RGB-trippel. Från den enda representationen förgrenar sig verktyget: HSL och HSV använder standardformlerna för min/max/kroma; CMYK härleds genom att hitta nyckelkanalen; och sRGB-linearisering (den styckvisa gammakurvan definierad i IEC 61966-2-1) tillämpas innan de perceptuella rymdberäkningarna.
  3. 3
    Perceptuella färgrymder beräknade från grunden
    oklch() beräknas med Björn Ottossons referensmatriser 3×3 (LMS-kubrotsrymd). lab() och lch() använder Bradford-kromatisk adaptation för att omvandla från D65-vitpunkten till D50, vilket motsvarar hur CSS Color 4 definierar lab(). Detta är samma formler som används i webbläsares renderingsmotorer — implementerade här utan externa beroenden.
  4. 4
    WCAG-kontrast och ljusstyrkeskala
    Relativ luminans beräknas enligt WCAG 2.1-formeln (lineariserade R-, G-, B-kanaler viktade 0,2126/0,7152/0,0722) och kontrastförhållandet mot vitt och svart graderas som AA-stor, AA, AAA eller Underkänt. En niostegs ljusstyrkeremsa genereras genom att stega HSL-ljushetskanalen från 10 % till 90 %, så att du kan klicka på valfritt färgprov för att omvandla just den nyansen.

Relaterade verktyg

Vanliga frågor