Pretvornik barv

Pretvarjanje barv med različnimi oblikami: HEX, RGB, HSL in HSV. Bistveno za oblikovalce in razvijalce, ki morajo delati z barvami na različnih platformah in v različnih orodjih za oblikovanje. Takoj pretvorite katero koli barvno vrednost v obliko, ki jo potrebujete za CSS, grafično programsko opremo ali druge aplikacije.

Pogosto zastavljena vprašanja

HEX je šestnajstiški zapis (npr. #FF5733), ki se pogosto uporablja pri spletnem oblikovanju. RGB predstavlja barve z rdečo, zeleno in modro barvo (0-255). HSL uporablja vrednosti Hue (0-360°), Saturation (0-100 %) in Lightness (0-100 %), kar omogoča intuitivno prilagajanje barv. HSV uporablja odtenek, nasičenost in vrednost (svetlost), kar je priljubljeno v grafični programski opremi. Vsak format ima svoje prednosti za različne primere uporabe.

HSL uporabite, kadar želite prilagoditi svetlost ali nasičenost barve, pri tem pa ohraniti konstanten odtenek. HSL je bolj intuitiven za ustvarjanje barvnih različic, odtenkov in senčil. Odličen je za ustvarjanje dostopnih barvnih shem in odzivnega oblikovanja, kjer potrebujete predvidljive prilagoditve svetlosti. RGB je boljši, kadar potrebujete natančen nadzor nad posameznimi barvnimi kanali.

Z orodji za razvijalce brskalnika preglejte element in kopirajte vrednost barve iz CSS. Vstavite jo v naš pretvornik v katerem koli formatu (HEX, RGB ali HSL) in takoj vam bomo prikazali enakovredne vrednosti v vseh drugih formatih. Za zajem barv lahko uporabite tudi razširitve brskalnikov ali izbirnike barv zaslonskih slik.

Kanal alfa določa preglednost z vrednostmi od 0 (popolnoma prozorno) do 1 (popolnoma neprozorno). RGBA in HSLA vključujeta to četrto vrednost za podporo prozornih ali polprozornih barv. To je bistvenega pomena za prekrivanje, sence in večplastne elemente oblikovanja v sodobnem spletnem oblikovanju.

Da! Sodobni brskalniki v celoti podpirajo barvne formate HSL in HSLA v CSS. Za barve s prosojnostjo uporabite sintakso: hsl(360, 100%, 50%) ali hsla(360, 100%, 50%, 0,5). HSL je še posebej uporaben v CSS za ustvarjanje barvnih različic z uporabo funkcije calc() ali lastnosti po meri CSS za dinamično oblikovanje tem.

Trimestne kode HEX (#RGB) so okrajšava, pri kateri je vsaka številka podvojena. Na primer, #F00 je enakovredno #FF0000. Ta okrajšava deluje le, če sta obe številki vsakega barvnega kanala enaki. Za natančen barvni nadzor in vse barve, ki ne ustrezajo kraticam, uporabite polno šestmestno obliko (#RRGGBB).

RGB je splošni koncept predstavljanja barv z rdečo, zeleno in modro vrednostjo. sRGB (standardni RGB) je poseben barvni prostor RGB, standardiziran za doslednost med napravami in spletnimi brskalniki. Večina spletnih barv temelji na sRGB, zato so barve na splošno videti skladne na različnih zaslonih in v različnih brskalnikih.

Po pretvorbi barv preverite kontrastna razmerja za dostopnost besedila. WCAG zahteva kontrast 4,5:1 za običajno besedilo in 3:1 za veliko besedilo. Pri pretvorbi med oblikami ostanejo vrednosti barv enake, vendar vam uporaba barv v različnih oblikah olajša njihovo uporabo v različnih oblikovalskih orodjih, pri tem pa ohranja dostopnost.

Da! Programska oprema za oblikovanje, kot so Figma, Adobe XD ali Photoshop, običajno prikazuje barve v RGB ali HEX. Kopirajte te vrednosti in jih pretvorite v obliko, ki jo potrebuje vaša koda. To zagotavlja popolno ujemanje barv med oblikovalskimi maketami in končno izvedbo.

Pretvarjanje med barvnimi formati lahko vključuje zaokroževanje. HEX uporablja cela števila (0-255), RGB uporablja cela števila, HSL/HSV pa stopinje in odstotke. Pri večkratnem pretvarjanju sem in tja lahko pride do manjših odstopanj zaradi zaokroževanja. Za kritično ujemanje barv dosledno delajte v enem formatu.