Farebné palety

Farebné palety pre mobilné aplikácie

V aplikácii farby ukazujú, na čo sa dá ťuknúť, čo je aktívne a čo sa podarilo alebo nepodarilo. Týchto 12 paliet obsahuje pozadie, plochy, hlavnú farbu a text podľa typu aplikácie, s HEX kódmi, ktoré prenesieš do Figmy, Flutteru, SwiftUI alebo React Native.

Fintech modrá a zelená

Modrá pre dôveru a zelená pre zostatky a úspešné transakcie.

Oranžová pre rozvoz jedla

Oranžová zvýrazní tlačidlá objednávky a akcie.

Zdravie a wellness

Pokojná; pre aplikácie na objednávanie k lekárovi, návyky alebo sledovanie.

Purpurový tmavý režim

Veľmi tmavosivé pozadie namiesto čistej čiernej, so svetlopurpurovým akcentom.

Sociálna ružová a purpurová

Pre sociálne siete, zoznamky alebo tvorcov obsahu.

Minimalistická produktivita

Veľmi čitateľná; pre správcov úloh a pracovné nástroje.

Žltá pre vzdelávanie

Veselá a jasná; pre aplikácie na jazyky alebo učenie.

Energický fitness

Limetková a červená na tmavom; pre tréningy a metriky.

Levanduľová pre meditáciu

Jemná a upokojujúca; pre spánok, meditáciu alebo denník.

Cestovateľská tyrkysová a piesková

Pripomína pláž a slnko; pre rezervácie a cestovných sprievodcov.

Svieža zelená pre jedlo

Pre supermarkety, recepty alebo výživu.

Prémiové nakupovanie

Neutrálna a elegantná; hlavnú úlohu necháva fotkám produktov.

Ťukni na farbu a skopíruj jej HEX kód. Ikona ceruzky otvorí paletu v editore, kde ju môžeš upraviť.

Farby stavov urči hneď na začiatku

Každá aplikácia potrebuje farby pre chybu, úspech, varovanie a informáciu. Vyber odtiene, ktoré sedia k tvojej palete, a farbu chyby nepoužívaj na nič iné, napríklad na tlačidlá značky. Farbu doplň ikonou alebo textom, aby význam nezávisel len od nej.

Navrhni aj tmavý režim

Väčšina telefónov podporuje tmavý režim a veľa používateľov ho má zapnutý. Nestačí farby obrátiť: namiesto čistej čiernej použi veľmi tmavé sivé a akcentom trochu zníž sýtosť, aby na pozadí nevibrovali.

Skontroluj kontrast a dotykové plochy

Text by mal mať podľa WCAG kontrast aspoň 4,5:1 voči pozadiu. Tlačidlá musia vyzerať inak, keď sú aktívne, stlačené alebo neaktívne. Vyskúšaj aplikáciu vonku a so zníženým jasom, pretože tak ju používa veľa ľudí.

Farby z týchto paliet

Dymová bielaBielaĽanováOranžováUhľovočiernaLomená bielaBorovicová zelenáEbenováSnehobielaPlatinováPruská modráSlonovinováJantárováNeónová žltáŠampanskáTiffany modrá

Časté otázky

Koľko farieb by mala mať aplikácia?

Zvyčajne jednu hlavnú farbu, voliteľne jednu vedľajšiu, neutrálne tóny na pozadia a texty a štyri farby stavov: chyba, úspech, varovanie a informácia.

Akú farbu použiť na hlavné tlačidlo aplikácie?

Hlavnú farbu tvojej značky, ak dobre kontrastuje s pozadím. Používaj ju len na najdôležitejšiu akciu na každej obrazovke.

Ďalšie palety: dizajn

Objavuj ďalej