Spalvų keitiklis

HEX - tai šešioliktainis užrašas (pvz., #FF5733), dažnai naudojamas žiniatinklio dizaine. RGB spalvoms žymėti naudojamos raudonos, žalios ir mėlynos spalvos (0-255). HSL naudoja atspalvį (0-360°), sodrumą (0-100 %) ir šviesumą (0-100 %), todėl spalvas reguliuoti galima intuityviai. HSV naudoja spalvas Hue (atspalvis), Saturation (sodrumas) ir Value (šviesumas), populiarias grafikos programinėje įrangoje. Kiekvienas formatas turi savų privalumų skirtingiems naudojimo atvejams.

Naudokite HSL, kai reikia koreguoti spalvos ryškumą arba sodrumą, išlaikant pastovų atspalvį. HSL yra intuityvesnė kuriant spalvų variacijas, atspalvius ir atspalvius. Ji puikiai tinka prieinamoms spalvų schemoms kurti ir reaguojančiam dizainui, kai reikia nuspėjamo šviesumo koregavimo. RGB geriau tinka, kai reikia tiksliai valdyti atskirus spalvų kanalus.

Naudodami naršyklės kūrėjo įrankius patikrinkite elementą ir nukopijuokite spalvos reikšmę iš CSS. Įkelkite ją į mūsų konverterį bet kokiu formatu (HEX, RGB arba HSL) ir mes iškart parodysime lygiavertes vertes visais kitais formatais. Spalvoms užfiksuoti taip pat galite naudoti naršyklės plėtinius arba ekrano nuotraukų spalvų rinkiklius.

Skaidrumą lemia alfa kanalas, kurio reikšmės yra nuo 0 (visiškai skaidrus) iki 1 (visiškai nepermatomas). RGBA ir HSLA apima šią ketvirtąją vertę, kad būtų galima naudoti skaidrias arba pusiau skaidrias spalvas. Tai labai svarbu šiuolaikinio žiniatinklio dizaino perdangoms, šešėliams ir sluoksniuotiems dizaino elementams.

Taip! Šiuolaikinės naršyklės visiškai palaiko HSL ir HSLA spalvų formatus CSS. Skaidrioms spalvoms naudokite sintaksę: hsl(360, 100%, 50%) arba hsla(360, 100%, 50%, 0,5). HSL ypač praverčia CSS kuriant spalvų variacijas naudojant calc() arba CSS pasirinktines savybes dinamiškam temų kūrimui.

Trijų skaitmenų HEX kodai (#RGB) yra trumpiniai, kuriuose kiekvienas skaitmuo padvigubinamas. Pavyzdžiui, #F00 atitinka #FF0000. Šis sutrumpinimas veikia tik tada, kai abu kiekvieno spalvų kanalo skaitmenys yra vienodi. Naudokite visą 6 skaitmenų formatą (#RRGGBB), jei norite tiksliai valdyti spalvas ir bet kokią spalvą, kuri neatitinka trumpinio modelio.

RGB - tai bendra koncepcija, kai spalvos vaizduojamos raudonos, žalios ir mėlynos spalvų reikšmėmis. sRGB (standartinė RGB) - tai konkreti RGB spalvų erdvė, standartizuota siekiant užtikrinti nuoseklumą įvairiuose įrenginiuose ir žiniatinklio naršyklėse. Daugumoje žiniatinklio spalvų naudojama sRGB, todėl spalvos paprastai atrodo vienodos skirtinguose ekranuose ir naršyklėse.

Konvertavę spalvas, patikrinkite kontrasto santykį, kad tekstas būtų prieinamas. WCAG reikalauja, kad įprasto teksto kontrastas būtų 4,5:1, o didelio teksto - 3:1. Konvertuojant iš vieno formato į kitą, spalvų reikšmės išlieka tos pačios, tačiau, turint skirtingų formatų spalvas, jas lengviau naudoti įvairiose projektavimo priemonėse, išlaikant prieinamumą.

Taip! Dizaino programinė įranga, pavyzdžiui, "Figma", "Adobe XD" ar "Photoshop", paprastai rodo spalvas RGB arba HEX. Nukopijuokite šias reikšmes ir konvertuokite jas į jūsų kodui reikalingą formatą. Taip užtikrinsite puikų spalvų atitikimą tarp dizaino maketų ir galutinio įgyvendinimo.

Konvertuojant iš vieno spalvų formato į kitą gali tekti apvalinti. HEX naudoja sveikuosius skaičius (0-255), RGB - sveikuosius skaičius, o HSL/HSV - laipsnius ir procentus. Keletą kartų konvertuojant pirmyn ir atgal, dėl apvalinimo gali atsirasti nedidelių skirtumų. Jei norite atlikti svarbų spalvų derinimą, nuosekliai dirbkite vienu formatu.