Palete boja
Sa svetlim i tamnim režimom

Palete boja za mobilne aplikacije · 32 primera

Pozadina, površina, glavna boja, akcenat i tekst u svetlom i tamnom režimu, uz to boje stanja. Pogledaj svaku paletu na pravom ekranu, kopiraj kodove ili je izvezi u Figmu, Flutter, SwiftUI ili Tailwind.

32paleta
2režimi: svetli i tamni
5formata izvoza

Isprobaj i ovo

Paleta boja iz imenaUpiši ime i dobij sopstvenu paletu bojaŠara od rođendanskih bojaKocke i pruge od rođendana cele porodiceTipologija boja iz selfijaOtkrij svoje godišnje doba i najbolje boje iz jedne fotografije
Svi besplatni alati →

Počni neutralnim bojama

Pozadina, površine i tekst zauzimaju gotovo ceo ekran, zato ih izaberi prve. Siva s blagim tonom glavne boje deluje promišljenije od čiste sive i pušta boju brenda da se istakne samo tamo gde je to važno.

Odredi boje stanja odmah na početku

Svakoj aplikaciji su potrebne boje za grešku, uspeh, upozorenje i informaciju. Izaberi nijanse koje se slažu s paletom i boju greške ne koristi ni za šta drugo, na primer za dugmad brenda. Dopuni boju ikonom ili tekstom kako poruka ne bi zavisila samo od boje.

Osmisli i tamni režim

Većina telefona podržava tamni režim i mnogi korisnici ga imaju uključenog. Nije dovoljno obrnuti boje: koristi veoma tamne sive umesto čiste crne i malo smanji zasićenost akcenata kako ne bi treperili na pozadini.

Proveri kontrast i dodirne površine

Tekst bi prema WCAG-u trebalo da ima kontrast s pozadinom od najmanje 4,5:1. Dugmad moraju da izgledaju drugačije kada su aktivna, pritisnuta ili isključena. Isprobaj aplikaciju napolju i pri niskoj osvetljenosti, jer je tako koristi mnogo ljudi.

Palete boja: Palete boja za mobilne aplikacije
Palete boja: Palete boja za mobilne aplikacije

Česta pitanja

Koliko boja bi aplikacija trebalo da ima?

Obično jednu glavnu boju, opcionu boju akcenta, neutralne boje za pozadine, površine i tekstove i četiri boje stanja: greška, uspeh, upozorenje i informacija.

Koju boju koristiti za glavno dugme aplikacije?

Glavnu boju tvog brenda, ako je u dobrom kontrastu s pozadinom. Koristi je samo za najvažniju radnju na svakom ekranu.

Kako napraviti tamni režim palete?

Pozadina postaje veoma tamna siva s blagim tonom boje brenda, površine su malo svetlije od pozadine, a akcenti se posvetle i ublaže. Tekst prelazi u prljavo belu. Kod svakog primera to ćeš videti kada klikneš na dugme „Tamni”.

Koju paletu izabrati za minimalističku aplikaciju?

Osnovu od sivih (gotovo bela pozadina, veoma svetlosive površine i gotovo crn tekst) s jednom jedinom bojom akcenta za ono važno. Tu ideju prate palete u kategoriji „Minimal”.

Kako da prenesem paletu u Figmu, Flutter ili SwiftUI?

Kod palete klikni na „Izvezi” i izaberi format: JSON tokeni za Figmu, ColorScheme za Flutter, boje sa svetlim i tamnim režimom za SwiftUI, Tailwind ili CSS promenljive. Kod kopiraš jednim dodirom.

Još paleta: dizajn

Istražuj dalje