Spalvų kodų keitiklis
Įvesk spalvą bet kokiu formatu ir iškart matyk ją konvertuotą į HEX, RGB, HSL, HSV ir CMYK — viskas sinchronizuota abiem kryptimis.
Spalvos įvestis
Atnaujinama, kol rašotePavyzdžiai
Kaip tai veikia
HSL (Hue, Saturation, Lightness — atspalvis, sodrumas, šviesumas) pertvarko spalvų erdvę aplink 360° spalvų ratą. Atspalvis pasirenka pagrindinę spalvą, sodrumas valdo jos ryškumą, o šviesumas perkelia ją tarp juodos (0 %) ir baltos (100 %). Todėl HSL idealiai tinka paletėms kurti: palik atspalvį fiksuotą ir keisk sodrumą ar šviesumą, kad sukurtum šviesesnius, tamsesnius ir tonuotus variantus. HSV (Hue, Saturation, Value) panašus, bet ryškumą apibrėžia kitaip — 100 % vertė yra ryškiausia atspalvio versija, todėl grafikos redaktoriai, pvz., Photoshop, jį mėgsta naudoti spalvų parinkikliuose.
CMYK (Cyan, Magenta, Yellow, Key/Black) yra atimamojo modelio sistema, naudojama spaudoje. Rašalai sugeria šviesą, o ne ją skleidžia, todėl CMYK spalvų gama siauresnė už RGB. Matematiškai konversija nesudėtinga, bet dėl tikslaus spausdinimo gali prireikti spalvų profilio koregavimo. Šis įrankis visus formatus konvertuoja per RGB kaip tarpininką ir rodo gyvą peržiūrą, papildomą spalvą bei artimiausią CSS pavadintą spalvą kiekvienai įvesčiai.
Patarimai ir geroji praktika
Dažniausiai užduodami klausimai
Kas yra HEX spalvos kodas?
HEX — tai 6 skaitmenų šešioliktainė notacija (#RRGGBB), vaizduojanti raudoną, žalią ir mėlyną kanalus. Kiekviena pora svyruoja nuo 00 iki FF (0–255 dešimtainėje sistemoje). Pavyzdžiui, #FF0000 yra gryna raudona, o #FFFFFF — balta.
Kaip veikia RGB?
RGB vaizduoja spalvas maišydamas raudoną, žalią ir mėlyną šviesą. Kiekvienas kanalas turi reikšmę nuo 0 iki 255. Visų trijų maksimali reikšmė (255,255,255) duoda baltą, o visi lygūs nuliui (0,0,0) — juodą.
Kuo skiriasi HSL ir HSV?
Abu naudoja atspalvį (0–360°) spalvų rato padėčiai. HSL naudoja sodrumą ir šviesumą — 50 % šviesumas yra gryna spalva. HSV naudoja sodrumą ir vertę (ryškumą) — 100 % vertė yra ryškiausia versija. Žiniatinklio dizainui HSL paprastai intuityvesnis.
Kaip rasti papildomąsias spalvas?
Papildomosios spalvos spalvų rate yra priešingose pusėse, t. y. atspalviu skiriasi 180°. HSL sistemoje tiesiog prie atspalvio pridėk 180 (pasiekus 360 grįžk į pradžią). Papildomos poros sukuria didelį kontrastą ir vizualinį efektą.
Kas yra CMYK ir kada jį naudoti?
CMYK reiškia Cyan, Magenta, Yellow ir Key (juoda). Tai atimamojo modelio spalvų sistema, naudojama spaudoje. Kuriant fizinei medijai — vizitinėms, plakatams, pakuotėms — reikėtų dirbti CMYK režimu, kad popieriuje spalvos atsikartotų tiksliai.
Kodėl spalvos ekrane ir spaudoje atrodo skirtingai?
Ekranai naudoja pridėtinę RGB šviesą (maišo šviesos bangos ilgius), o spausdintuvai — atimamąjį CMYK rašalą (sugeria šviesą). RGB gali atvaizduoti ryškius neoninius ir elektrinius atspalvius, kurių CMYK fiziškai atkurti negali, todėl ekrane ryškios spalvos spaudoje dažnai atrodo blankesnės.
Kaip patikrinti spalvų kontrastą dėl prieinamumo?
WCAG 2.1 reikalauja bent 4,5:1 kontrasto santykio įprastam tekstui ir 3:1 didelio dydžio tekstui. Konvertuok priekinio plano ir fono spalvas į RGB, apskaičiuok jų santykinį skaistumą, tada išvesk santykį. Daugelis internetinių įrankių šį patikrinimą atlieka automatiškai.
Kas yra CSS pavadinta spalva?
CSS apibrėžia 148 pavadintas spalvas (pvz., „coral“, „teal“, „rebeccapurple“), kurias gali naudoti tiesiogiai stilių lapuose vietoj HEX ar RGB reikšmių. Pavadintas spalvas lengviau įsiminti, bet jos siūlo ribotą paletę, palyginti su visais 16,7 mln. spalvų, pasiekiamų per HEX.
Kaip rankiniu būdu konvertuoti HEX į RGB?
Padalyk 6 skaitmenų HEX kodą į tris poras, tada kiekvieną porą iš 16-tainės paversk dešimtaine. Pavyzdžiui, #2563EB tampa 25₁₆ = 37, 63₁₆ = 99, EB₁₆ = 235, gaunasi RGB(37, 99, 235).
Kas yra saugios žiniatinklio spalvos?
216 spalvų paletė, kuri nuosekliai atsivaizdavo ankstyvuose 8 bitų monitoriuose. Kiekvienas RGB kanalas naudoja vieną iš šešių reikšmių (00, 33, 66, 99, CC, FF). Šiuolaikiniuose ekranuose jos iš esmės pasenusios, bet vis dar minimos senuose projektuose.