Konverzia farieb
#0b1304
Black Forest
Variácie
Účelom tejto sekcie je presne vytvoriť odtiene (pridaním čistej bielej) a tiene (pridaním čistej čiernej) tvojej vybranej farby v 10% prírastkoch.
Profesionálny tip: Použi tiene pre stavy hover a tiene, odtiene pre zvýraznenia a pozadia.
Tiene
Tmavšie variácie vytvorené pridaním čiernej k tvojej základnej farbe.
Odtiene
Svetlejšie variácie vytvorené pridaním bielej k tvojej základnej farbe.
Bežné použitia
- • Stavy UI komponentov (hover, aktívne, deaktivované)
- • Vytváranie hĺbky s tieňmi a zvýrazneniami
- • Budovanie konzistentných farebných systémov
Tip pre dizajnový systém
Tieto variácie tvoria základ súdržnej farebnej palety. Exportuj ich, aby si udržal konzistenciu v celom projekte.
Farebné kombinácie
Každá harmónia má svoju vlastnú náladu. Použi harmónie na brainstormovanie farebných kombinácií, ktoré spolu dobre fungujú.
Ako používať
Klikni na akúkoľvek farbu, aby si skopíroval jej hex hodnotu. Tieto kombinácie sú matematicky dokázané, že vytvárajú vizuálnu harmóniu.
Prečo je to dôležité
Farebné harmónie vytvárajú rovnováhu a vyvolávajú špecifické emócie v tvojich dizajnoch.
Komplement
Farba a jej opak na farebnom kolese, +180 stupňov odtieňa. Vysoký kontrast.
Rozdelený komplement
Farba a dve susedné k jej komplementu, +/-30 stupňov odtieňa od hodnoty oproti hlavnej farbe. Odvážne ako priamy komplement, ale všestrannejšie.
Triadický
Tri farby rovnomerne rozmiestnené na farebnom kolese, každá 120 stupňov odtieňa od seba. Najlepšie je nechať jednu farbu dominovať a ostatné použiť ako akcenty.
Analogický
Tri farby s rovnakou svetelnosťou a saturáciou s odtieňmi, ktoré sú susedné na farebnom kolese, 30 stupňov od seba. Hladké prechody.
Monochromatický
Tri farby rovnakého odtieňa s hodnotami svetelnosti +/-50%. Jemné a rafinované.
Tetradický
Dve sady komplementárnych farieb, oddelené o 60 stupňov odtieňa.
Princípy farebnej teórie
Rovnováha
Použi jednu dominantnú farbu, podporte ju sekundárnou a akcentuj striedmo.
Kontrast
Zabezpeč dostatočný kontrast pre čitateľnosť a prístupnosť.
Harmónia
Farby by mali spolupracovať na vytvorení jednotného vizuálneho zážitku.
Kontrola kontrastu farieb
Testuj farebné kombinácie, aby si sa uistil, že spĺňajú štandardy prístupnosti WCAG pre čitateľnosť textu.
Farba textu
Farba pozadia
Kontrast
Štandardy WCAG
Pokročilý kontrolór kontrastu
Jemné doladenie pomocou posuvníkov, viacerých náhľadov a ďalších možností
Každý je génius. Ale ak posudzujete rybu podľa jej schopnosti vyliezť na strom, prežije celý svoj život v presvedčení, že je hlúpa.