raatools/

Színkonverter

Alakítson színeket HEX, RGB és HSL között azonnal.

#4F46E5
rgb(79, 70, 229)
hsl(243, 75%, 59%)
HSL színválasztó
hex
#4f46e5
rgb
rgb(79, 70, 229)
hsl
hsl(243, 75%, 59%)
rgba
rgba(79, 70, 229, 1)

Mi a színváltó eszköz?

A színváltó különböző színmodellek között fordítja le a színértékeket – HEX, RGB, HSL, HSV és CMYK. A tervezők és fejlesztők gyakran kell váltaniuk a formátumok között: a CSS HEX-et és RGB-t használ, a tervezőeszközök az intuitív színválasztáshoz HSL-t, a nyomtatási munkafolyamatok CMYK-t igényelnek. Ez az eszköz azonnal elvégzi az összes átváltást.

Az egyes színmodellek eltérően ábrázolják a színeket. Az RGB (Piros, Zöld, Kék) a fényt keveri – képernyőkhöz használják. A CMYK (Cián, Magenta, Sárga, Fekete) a tintát keveri – nyomtatáshoz használják. A HSL (Árnyalat, Telítettség, Világosság) úgy írja le a színeket, ahogy az emberek gondolkodnak róluk – tiszta szín, élénkség és fényerő. A HEX csupán az RGB hexadecimális formátumban.

Színmodellek magyarázata

  • HEX – hatjegyű hexadecimális kód (#FF5733). Kompakt és széles körben használt a webfejlesztésben.
  • RGB – három érték (0–255) a piroshoz, zöldhöz és kékhez. A képernyők natív színmodellje.
  • HSL – árnyalat (0–360 fok), telítettség (0–100%) és világosság (0–100%). Intuitív a színpalettákhoz.
  • HSV/HSB – az HSL-hez hasonló, de a harmadik összetevőként a világosság helyett az értéket/fényességet használja. Általános a grafikai tervezőeszközökben.
  • CMYK – négy érték (0–100%) a cián, magenta, sárga és fekete színhez. Nyomtatási gyártásban használt.

Az eszköz használata

Adjon meg egy színértéket bármely támogatott formátumban, és az összes többi megjelenítés azonnal kiszámításra kerül. Használja a színválasztót a vizuális kiválasztáshoz. Az eszköz egy előnézeti mintát és a konvertált értékeket mutatja HEX, RGB, HSL, HSV és CMYK formátumban, készen a másolásra és beillesztésre a kódjába vagy tervezőeszközébe.

Színek a webfejlesztésben

A CSS több színformátumot támogat: hex (#ff5733), rgb(255, 87, 51), hsl(11, 100%, 60%) és nevesített színek (tomato). A modern CSS az oklch() és oklab() érzékelési egyenletességet biztosító színtereket is támogatja. A formátumok közötti választásnál a HEX a legkompaktabb, a HSL a legkönnyebben állítható programozhatóan (L növelésével világosítás, S csökkentésével desaturálás), az RGB a legszélesebb körben támogatott.

Gyakran ismételt kérdések

Miért néznek ki másképp a színek képernyőn és nyomtatásban?

A képernyők fényt bocsátanak ki (RGB, additív keverés), a nyomtatók fényt elnyelő tintát használnak (CMYK, szubtraktív keverés). Az RGB színtér (lehetséges színek köre) nagyobb a CMYK-nál, ezért egyes élénk képernyős színek nem reprodukálhatók nyomtatásban. Ezért a tervezőknek nyomtatott anyagokhoz CMYK-ban kell dolgozniuk, és kritikus színegyeztetéshez Pantone-színeket kell használniuk.

Mi a különbség a HSL és a HSV között?

Mindkettő az árnyalatot és a telítettséget használja, de különbözik a harmadik összetevőben. A HSL világossága 0 (fekete) értéktől 0,5-ön (tiszta szín) át 1-ig (fehér) terjed. A HSV értéke 0 (fekete) értéktől 1-ig (teljes fényerő) terjed. A HSL-ben a 100%-os telítettség 50%-os világossággal adja a legtisztább színt. A HSV-ban a 100%-os telítettség és 100%-os érték adja a legtisztább színt. A HSL általában intuitívabb webdesignhoz.