HEX ↔ RGB ↔ HSL-omvandlare

Konvertera färger mellan HEX, RGB och HSL direkt med en live-swatch. Redigera vilket fält som helst – de andra förblir synkroniserade.

HEX ↔ RGB ↔ HSL Converter

Live

Picker / HEX

HEX

RGB

HSL

#C026D3

CSS output

/* HEX */ #c026d3
/* RGB */ rgb(192, 38, 211)
/* HSL */ hsl(292, 70%, 49%)

Key capabilities

Konvertera färger mellan HEX, RGB och HSL direkt med en live-swatch.
Körs i din webbläsare
Gratis att använda

Så använder du

Ange ett HEX-, RGB- eller HSL-värde.
Se att de andra formaten uppdateras automatiskt.
Kopiera formatet du behöver.

How this tool works

Ange ett HEX-, RGB- eller HSL-värde.
Se att de andra formaten uppdateras automatiskt.
Kopiera formatet du behöver.

Recommended settings

Använd först standardalternativen och justera sedan om det behövs

Supported formats

Text / on-page input

File size and limits

Mycket komplexa förhandsvisningar i flera lager kan kännas långsammare på äldre telefoner.

Privacy

Färg- och CSS-generatorer körs helt i din webbläsare. Förhandsvisningar och konverteringar laddar aldrig upp dina stilar.

Common use cases

Använd HEX ↔ RGB ↔ HSL Converter när du behöver: Konvertera färger mellan HEX, RGB och HSL direkt med en live-swatch.

Troubleshooting

Förhandsgranskningen ser annorlunda ut efter inklistring

Kontrollera om det finns konkurrerande CSS på din sida (återställningar, ärvda färger). Kopiera den genererade regeln till en isolerad stilmall först.

FAQ

Laddar detta upp min CSS?

Nej. Generatorer och omvandlare körs i din webbläsare med liveförhandsvisning.

Behöver jag ett konto?

Nej. Öppna verktyget, justera kontrollerna och kopiera CSS.

Relaterade verktyg

Color Contrast Checker

Check foreground/background contrast against WCAG AA and AAA guidelines.

Open tool

CSS Gradient Generator

Build linear, radial, and conic gradients with live preview and copy-ready CSS.

Open tool

Box Shadow Generator

Design layered box-shadows with offset, blur, spread, and color — live preview included.

Open tool