Spalvų rinkiklis

Kaip naudotis spalvų rinkikliu

1. Spustelėk spalvos pavyzdį po Pasirink spalvą, kad atidarytum naršyklės spalvų rinkiklį, ir pasirink spalvą. Taip pat gali įrašyti arba įklijuoti reikšmę į lauką Spalvos kodas: HEX kodą, pvz., #1E90FF, rgb(30, 144, 255), hsl(210 100% 56%) arba CSS pavadinimą, pvz., tomato.
2. Didelė peržiūra atsinaujina iškart, o HEX kodas parašytas juoda arba balta spalva, kuri geriau skaitoma ant to fono.
3. Skiltyje Spalvų kodai nukopijuok reikiamą formatą mygtuku Kopijuoti šalia jo: HEX, RGB, HSL, HSV arba CMYK.
4. Spustelėk Atsitiktinė spalva, kai ieškai įkvėpimo, arba Paimti iš ekrano (naršyklėse, kurios tai palaiko, pvz., „Chrome“ ir „Edge“), kad paimtum bet kurį ekrano pikselį, įskaitant kitus langus.

Viskas vyksta tavo naršyklėje: jokia spalva ar vaizdas niekur nesiunčiama.

Ką reiškia kiekvienas spalvos kodas

• HEX yra šešių ženklų šešioliktainis žymėjimas, naudojamas HTML ir CSS. Kiekviena skaitmenų pora yra vienas kanalas (raudona, žalia, mėlyna) nuo 00 iki FF, todėl #1E90FF reiškia raudona 30, žalia 144, mėlyna 255.
• RGB pateikia tuos pačius tris kanalus dešimtainiais skaičiais nuo 0 iki 255. Jo tikisi dauguma dizaino programų ir programavimo bibliotekų.
• HSL apibūdina spalvą atspalviu (kampu nuo 0° iki 360° spalvų rate), sodrumu ir šviesumu. Patogu spalvą pašviesinti ar patamsinti pakeitus vieną skaičių.
• HSV (dar vadinama HSB) naudoja atspalvį, sodrumą ir reikšmę (ryškumą). Tai modelis, esantis „Photoshop“, „Figma“ ir daugelio kitų redaktorių spalvų kvadratų pagrindu.
• CMYK išreiškia spalvą žydros, purpurinės, geltonos ir juodos spalvos dažų procentais.

Apie CMYK reikšmes

CMYK kodai gaunami paprastu konvertavimu: K = 1 − max(R, G, B), tada C = (1 − R − K) / (1 − K), panašiai M ir Y. Tai standartinė vadovėlinė formulė, bet ji nenaudoja ICC profilio. Tikroji spauda priklauso nuo spausdinimo mašinos, popieriaus ir dažų, todėl spaustuvė konvertuos tavo spalvas pagal savo profilį ir rezultatas gali skirtis. Šiuos skaičius naudok kaip pradinį tašką, o ne kaip spaudos įrodymą.

Kontrasto santykių skaitymas

Po HEX kodu peržiūroje rodomi Kontrastas ant baltos ir Kontrastas ant juodos, apskaičiuoti pagal WCAG 2 santykinio šviesio formulę. Įprastam pagrindiniam tekstui AA lygiu reikia 4,5:1 ar daugiau, o dideliam tekstui ir sąsajos elementams – 3:1. Jei tavo spalva ant baltos pasiekia tik 3:1, pasilik ją didelėms antraštėms ar piktogramoms, o tekstui naudok tamsesnį atspalvį.

Patarimai

• Galima įklijuoti hex kodus be #: 1e90ff irgi veikia, kaip ir trumposios formos, pvz., f60.
• Reikšmės su skaidrumu, pvz., rgb(0 0 0 / 50%), priimamos; rinkiklis parodo nepermatomą spalvą.
• Pačios naršyklės spalvų dialogas skiriasi įvairiose sistemose. Jei reikia tikslios reikšmės, ją įrašius į lauką Spalvos kodas visada gaunama tiksli spalva.