Preskočiť na obsah
TextArray

Ako previesť farby medzi HEX, RGB a HSL

Blog /

Weboví dizajnéri a vývojári často pracujú s farbami v rôznych formátoch v rámci projektov, dizajnových systémov a nástrojov. Či už prepínate medzi maketou dizajnu v HSL, súborom CSS pomocou RGB alebo pokynom pre značku v HEX, vedieť, ako rýchlo konvertovať medzi týmito formátmi, šetrí čas a zabraňuje chybám.

Pochopenie troch hlavných farebných formátov

HEX (hexadecimálny) zápis predstavuje farby ako šesťznakové kódy #FF5733, kde dvojice znakov definujú intenzitu červenej, zelenej a modrej. RGB (červená, zelená, modrá) používa desatinné hodnoty od 0 do 255 pre každý farebný kanál - napr. rgb(255, 87, 51). HSL (hue, saturation, lightness) popisuje farbu pomocou uhla pre odtieň (0-360°), percenta pre sýtosť (0-100%) a percenta pre svetlosť (0-100%), zapísané ako hsl(9, 100%, 60%).

Prečo prevádzať medzi formátmi

Rôzne nástroje a kontexty uprednostňujú rôzne formáty. Dizajnéri často pracujú v HSL, pretože je intuitívne na úpravu jasu a sýtosti. Weboví vývojári používajú RGB alebo HEX v šablónach so štýlmi CSS. Produkcia tlače môže vyžadovať iný farebný priestor. Konverzia vám umožňuje presúvať prácu medzi nástrojmi bez manuálneho opätovného zadávania farieb.

Ako funguje konverzia

Konverzia medzi formátmi zahŕňa matematické vzťahy. HEX-to-RGB je jednoduché: rozdeľte šesť znakov do troch párov a preveďte každý z hexadecimálnych (základ 16) na desiatkové (základ 10). RGB-to-HSL je zložitejšie, nájdenie maximálnych a minimálnych hodnôt kanálov, potom odvodenie odtieňa, sýtosti a svetlosti. Obrátené procesy používajú inverznú matematiku na pohyb späť.

Konverzia farieb online

Manuálny výpočet je náchylný na chyby pri opakovaných prevodoch. Použite Prevodník farieb na okamžitú transformáciu medzi HEX, RGB a HSL. Prilepte farbu v akomkoľvek formáte a uvidíte ekvivalenty vo všetkých ostatných, čím sa eliminuje potreba rozumieť matematike.

Zabezpečte prístupný výber farieb

Po konvertovaní farby overte, že spĺňa štandardy dostupnosti Kontrola kontrastu na potvrdenie dostatočného kontrastu s vaším textom. Ak potrebujete inšpiráciu na dizajn, Generátor náhodných farieb vytvára nové palety, ktoré potom môžete previesť do preferovaného formátu.

Ochrana osobných údajov: farby zostanú na vašom zariadení

Konvertor farieb spracuje každú konverziu vo vašom prehliadači - na server sa neposielajú žiadne údaje. Vaše farebné palety, rozpracované návrhy a špecifikácie značky zostanú vo vašom zariadení súkromné. Nástroj funguje offline po načítaní stránky, takže môžete pokračovať v konverzii farieb bez prístupu na internet.