1. Érték megadása
Írjon be egy számot a beviteli mezőbe. Használhat pontot vagy vesszőt tizedesjegyként.
RGB HSL-re
Ez az átváltó azonnal átszámol. Adjon meg egy értéket és az eredmény azonnal megjelenik.
Loading tool editor...
Mikor kell használni: RGB HSL-re?
A HSL (árnyalat, telítettség, világosság) egy alternatív módja a színek megadásának, amely intuitívabb az ember számára. Az árnyalat a szín szöge (0–360°), a telítettség a szín intenzitása (0–100%), a világosság pedig a fényesség/sötétség (0–100%).
A HSL megkönnyíti a színvariációk létrehozását: állítsa a világosságot árnyalatokhoz, a telítettséget tompított/élénk verziókhoz, vagy tolja el az árnyalatot komplementer színekhez.
A CSS natívan támogatja a hsl()-t: hsl(14, 100%, 60%) egyenértékű az rgb(255, 87, 51) és #FF5733 értékkel.
Minden számítás helyben, a böngészőjében történik.
Hogyan használja az átváltót?
2. Eredmény leolvasása
Az átváltás eredménye azonnal megjelenik a mellette lévő mezőben – kattintás nélkül.3. Másolás vagy megfordítás
Kattintson az Eredmény másolása gombra vagy használja a Megfordítás gombot.
Mikor hasznos ez az átváltó?
Színkezelés
Változatok létrehozása: változtassa az L (világosság) értékét, miközben H és S állandó.Webfejlesztés
hsl(217, 91%, 60%)— intuitív színjelölés.Sötét mód
Az L 95%-ról 10%-ra változtatása sötét téma változatot hoz létre.Tervezés
A HSL megkönnyíti az egységes paletták létrehozását: forgassa el H-t 120°-kal = komplementer szín.
Mi teszi különlegessé ezt az átváltót?
Teljes adatvédelem
Minden számítás helyben, a böngészőjében történik. Semmilyen adat nem kerül szerverre.Azonnali eredmények
Az eredmény azonnal frissül gépelés közben – nem kell semmilyen gombra kattintani.Kétirányú átváltás
A Megfordítás gomb segítségével egy kattintással válthat irányt.Referencia táblázat
Kész táblázat gyakran átváltott értékekkel és kontextuális leírásokkal.
Hogyan működik az átváltás?
RGB normalizálása 0–1-re. Max és Min megtalálása. L = (max + min) / 2.
A HSL teljesen visszafordítható — az RGB-re való visszakonvertálás pontosan ugyanazt a színt adja.
Gyakorlati tippek
- Piros: hsl(0, 100%, 50%). Zöld: hsl(120, 100%, 50%). Kék: hsl(240, 100%, 50%).
- Komplementer szín: adjon hozzá 180°-ot az árnyalathoz. Piros (0°) → Ciánkék (180°).
- Világosítás: növelje L%-ot. Sötétítés: csökkentse L%-ot. L=0% = fekete, L=100% = fehér.
- Telítettségcsökkentés: csökkentse S%-ot. S=0% = szürkeárnyalat. S=100% = tiszta szín.
RGB vs HSL – összehasonlítás
| Tulajdonság | RGB | HSL |
|---|---|---|
| Modell | Additív csatornák | Árnyalat/Telítettség/Világosság |
| Értékek | 0–255 per channel | H: 0–360°, S/L: 0–100% |
| Intuitív | Nehéz a színek előrejelzése | Könnyű a színek módosítása |
| Színelmélet | Nem színkör alapú | Színkörre vetíthető |
| CSS támogatás | rgb(R, G, B) | hsl(H, S%, L%) |
RGB
- Modell
Additív csatornák - Értékek
0–255 per channel - Intuitív
Nehéz a színek előrejelzése - Színelmélet
Nem színkör alapú - CSS támogatás
rgb(R, G, B)
HSL
- Modell
Árnyalat/Telítettség/Világosság - Értékek
H: 0–360°, S/L: 0–100% - Intuitív
Könnyű a színek módosítása - Színelmélet
Színkörre vetíthető - CSS támogatás
hsl(H, S%, L%)
RGB átváltása más egységekre
További mértékegység-átváltók
Gyakran ismételt kérdések
Segítsen javítani eszközeinket
Van ötlete, hibát talált vagy funkciót szeretne javasolni? Írjon nekünk – 24 órán belül válaszolunk.