Färgkodsgenerator

Välj en färg och kontrollera omedelbart HEX-, RGB- och HSL-koder — plus komplementfärg och CSS-namn.

Omedelbart resultat Körs i webbläsaren
HEX-kod
#3D7EF7
RGB-värden
rgb(61, 126, 247)
HSL-värden
hsl(218, 91%, 60%)
Färgnamn
—
Komplementfärg
#F7823D

Guide till färgmodeller

HEX  → #RRGGBB
RGB  → 0–255 per ch.
HSL  → 0–360° / 0–100%
WCAG → min 4.5:1

HEX är kompakt för CSS. RGB motsvarar skärmpixlar. HSL är intuitivt för designers — reglera nyans, mättnad och ljushet oberoende av varandra.

Hur använder man?

  1. 1
    Välj en färgKlicka på färgväljaren och välj valfri färg. Alla formatkoder uppdateras omedelbart.
  2. 2
    Se alla formatHEX-kod, RGB-värden, HSL-värden, CSS-färgnamn (om tillgängligt) och komplementfärg visas samtidigt.
  3. 3
    Kopiera din kodKlicka på kopieringsknappen bredvid HEX, RGB eller HSL för att spara värdet till urklipp för CSS eller designverktyg.

FAQ

Vad är en HEX-färgkod?
En HEX-färgkod är ett 6-siffrigt hexadecimalt tal (#RRGGBB) som representerar intensiteterna för de röda, gröna och blå kanalerna. Varje par varierar från 00 (ingen) till FF (full = 255). HEX stödjer 16,7 miljoner färger (256³) och är standardformatet för CSS och webbdesignverktyg.
Vad är skillnaden mellan RGB och HSL?
RGB beskriver en färg som tre ljusintensiteter (röd, grön, blå) 0–255, vilket matchar hur monitorer fungerar. HSL använder nyans (0–360°), mättnad (0–100%) och ljushet (0–100%). HSL är mer intuitivt för designers — ändra nyansen för att byta färgfamilj, mättnaden för livlighet, ljusheten för klarhet.
Vad är en komplementfärg?
En komplementfärg ligger precis mittemot på färghjulet (180° nyans bort). Komplementpar skapar maximal kontrast: Röd ↔ Cyan, Grön ↔ Magenta, Blå ↔ Gul.

Färgmodeller i webbdesign

Färg på webben representeras av tre huvudmodeller: HEX (hexadecimalt), RGB (röd-grön-blå) och HSL (nyans-mättnad-ljushet). Var och en tjänar olika syften i CSS, webbdesign och färgteori.

HEX-färgkoder

HEX är det vanligaste färgformatet inom webbutveckling. Skrivet som #RRGGBB, stödjer det 16 777 216 färger och används överallt: CSS, HTML, Figma, Photoshop och varumärkesriktlinjer.

WCAG tillgänglighet

Ungefär 8% av männen har färgseendesvårigheter. WCAG 2.1 AA kräver ett kontrastförhållande på minst 4,5:1 för normal text. Förmedla aldrig information enbart genom färg.

Integritet

Alla beräkningar sker i webbläsaren. Inga uppgifter skickas till servern.

Kommentarer