Färgkodskonverterare

Färgkonverterare mellan HEX-, RGB-, HSL- och OKLCH-koder, med WCAG-kontrastvärdet för två färger. Så kontrollerar du tillgängligheten medan du väljer palett, gratis i webbläsaren.

HEX

#3b82f6

RGB

rgb(59, 130, 246)

HSL

hsl(217, 91%, 60%)

OKLCH

oklch(0.623 0.188 259.8)

HSL-justering

H217S91%L60%

Kontrastförhållande (WCAG)

Jämförelsefärg:

샘플 텍스트

Kontrastförhållande: 3.68:1

WCAG: AA Large

Bädda in

<iframe src="https://devtools.patrache.studio/sv/converters/color-converter/?embed=1" width="100%" height="620"
  style="border:1px solid #e5e7eb;border-radius:12px" loading="lazy"
  title="Färgkodskonverterare — Patrache Studio DevTools"></iframe>
<p><a href="https://devtools.patrache.studio/sv/converters/color-converter/">Färgkodskonverterare</a> by
   <a href="https://patrache.studio/">Patrache Studio</a></p>

Senast uppdaterad: 2026 · Gratis onlineverktyg

Vad är Färgkodskonverterare?

Färgkonverterare mellan HEX-, RGB-, HSL- och OKLCH-koder, med WCAG-kontrastvärdet för två färger. Så kontrollerar du tillgängligheten medan du väljer palett, gratis i webbläsaren.

Så använder du

1
Ange en färg— Använd färgväljaren eller textinmatning. HEX, rgb() och hsl() format stöds.
2
Visa format— HEX, RGB, HSL och OKLCH format visas samtidigt.
3
Kopiera värden— Använd kopieringsknappen för varje format för att kopiera CSS-värdet.
4
Kontrollera kontrastförhållande— Ställ in en jämförelsefärg för att kontrollera WCAG-kontrastförhållandet.

Relaterade verktyg

CSS-gradientgeneratorVisuell CSS-gradientgenerator för linjära, radiella och koniska gradienter: sätt färgstopp, justera vinkeln och kopiera CSS-koden. Perfekt för bakgrunder och knappar, gratis i webbläsaren.

CSS box-shadow-generatorCSS-box-shadow-generator med reglage för offset, oskärpa, spridning, färg och inset samt liveförhandsvisning. Kopiera färdig box-shadow-CSS, gratis i webbläsaren.

CSS-enhetsreferensReferens för CSS-enheter som px, em, rem, %, vw, vh, vmin, vmax och ch, ordnade per kategori. Med tydliga förklaringar av varje absolut och relativ enhet, gratis i webbläsaren.

PX till REM KonverterarePX-till-REM-konverterare som räknar om CSS-pixlar och rem åt båda hållen utifrån en valfri rotstorlek, decimaler inkluderade. Med kopieringsbar referenstabell och CSS-snutt, gratis i webbläsaren.

Vanliga frågor

OKLCH är en cylindrisk representation av Oklabs färgrymd, den mest perceptuellt enhetliga färgrymden. Den stöds i CSS Color Level 4.

Det mäter ljusskillnaden mellan text- och bakgrundsfärger. AA kräver minst 4,5:1, AAA kräver 7:1.

För närvarande stöds bara ogenomskinliga färger (RGB, 6-siffrigt HEX). RGBA och HSLA kommer i en framtida uppdatering.

Ja. Du kan klistra in utdata från varje format direkt i din CSS.

Nej. Alla färgkonverteringar sker i din webbläsare.