pluri.tools
🇸🇪
🇬🇧 English 🇧🇷 Português 🇪🇸 Español 🇫🇷 Français 🇩🇪 Deutsch 🇮🇹 Italiano 🇯🇵 日本語 🇳🇱 Nederlands 🇵🇱 Polski 🇹🇷 Türkçe 🇸🇪 Svenska 🇳🇴 Norsk 🇩🇰 Dansk

RGB till HSL-omvandlare

HEX → RGBHEX → HSLRGB → HEXRGB → HSLHSL → HEXHSL → RGB
RGB
Indata
R
G
B
HSL
Resultat
H
S%
L%
HEX
↔ HSL till RGB-omvandlare

Vad är RGB till HSL-omvandlare

Det här verktyget omvandlar RGB-värden (rött 0–255, grönt 0–255, blått 0–255) till HSL (Hue, Saturation, Lightness). HSL är mer intuitivt för färgmanipulation — det är mycket enklare att skapa ljusare eller mörkare versioner av en färg genom att justera ljushetsvärdet än genom att ändra enskilda RGB-kanaler.

Så använder du

  1. Ange värdena för rött, grönt och blått (0–255) i RGB-fälten.
  2. HSL- och HEX-värden uppdateras direkt.
  3. Klicka på kopiera-knappen bredvid HSL för att kopiera formatet hsl(h, s%, l%).
  4. Växla mellan alla 6 omvandlare med lägeslänkarna högst upp.

När du använder det

Flyttar du en varumärkesfärg från en gammal stilmall till ett HSL-baserat designsystem? Ange rgb(59, 130, 246) så får du tillbaka hsl(217, 91%, 60%). Därifrån kan du sänka ljusheten till 55 % för ett hover-läge och 45 % för ett aktivt läge, allt utan att röra nyansen.

Vanliga frågor

Vad är rgb(255, 0, 0) i HSL?

rgb(255, 0, 0) är hsl(0, 100%, 50%) — rent rött. Nyans 0° är rött, 100 % mättnad betyder fullt mättat och 50 % ljushet är den rena mellantonen.

Vad är rgb(0, 0, 0) i HSL?

rgb(0, 0, 0) är hsl(0, 0%, 0%) — svart. Noll ljushet är alltid svart.

Vad är rgb(255, 255, 255) i HSL?

rgb(255, 255, 255) är hsl(0, 0%, 100%) — vitt. Maximal ljushet är alltid vitt.

Varför är omvandling från RGB till HSL användbar?

HSL gör färgsamband synliga. Med rgb(59, 130, 246) ser du inte direkt hur blå eller ljus färgen är. Men hsl(217, 91%, 60%) berättar genast att det är en blå färg (217° på färghjulet), starkt mättad (91 %) och mellanljus (60 %).

Kan jag dela verktyget med mina värden ifyllda?

Ja. Webbadressen uppdateras automatiskt medan du skriver. Kopiera den från adressfältet eller använd Dela-knappen — den som öppnar länken ser exakt dina värden redo att användas.

Relaterade verktyg

HSL till RGB-omvandlare

Omvandla HSL-färgvärden till RGB direkt. Gratis HSL till RGB-omvandlare med live-förhandsvisning. Gör om hsl() till rgb() för JavaScript och Canvas.

Bildförhållande Kalkylator

Räkna ut bildförhållandet, hitta saknad bredd eller höjd och ändra storlek på bilder och video utan att förvränga proportionerna. Gratis.

Base64-avkodare

Avkoda Base64-strängar till vanlig text direkt i din webbläsare. Stöder fullständig Unicode-utdata inklusive emojis. Gratis Base64-avkodare online.