Започни с неутралните цветове
Фонът, повърхностите и текстът заемат почти целия екран, затова ги избери първи. Сиво с лек оттенък на основния цвят изглежда по-грижливо от чистото сиво и оставя цвета на марката да изпъкне само там, където има значение.
Определи цветовете за състояния още в началото
Всяко приложение има нужда от цветове за грешка, успех, предупреждение и информация. Избери нюанси, които пасват на палитрата, и не използвай цвета за грешка за нищо друго, например за бутоните на марката. Допълни цвета с икона или текст, за да не зависи съобщението само от цвета.
Проектирай и тъмен режим
Повечето телефони поддържат тъмен режим и много потребители го държат включен. Не е достатъчно да обърнеш цветовете: използвай много тъмни сиви вместо чисто черно и леко намали наситеността на акцентите, за да не трептят върху фона.
Провери контраста и зоните за докосване
Според WCAG текстът трябва да има контраст с фона поне 4,5:1. Бутоните трябва да изглеждат различно, когато са активни, натиснати или изключени. Изпробвай приложението навън и при ниска яркост, защото много хора го използват така.
Често задавани въпроси
Колко цвята трябва да има едно приложение?
Обикновено един основен цвят, незадължителен акцентен цвят, неутрални цветове за фонове, повърхности и текстове и четири цвята за състояния: грешка, успех, предупреждение и информация.
Какъв цвят да използвам за главния бутон на приложението?
Основния цвят на твоята марка, ако контрастира добре с фона. Използвай го само за най-важното действие на всеки екран.
Как да създам тъмен режим на палитрата?
Фонът става много тъмно сиво с лек оттенък на цвета на марката, повърхностите са малко по-светли от фона, а акцентите се изсветляват и омекотяват. Текстът преминава в мръсно бяло. При всеки пример ще го видиш, след като щракнеш бутона „Тъмен“.
Каква палитра да избера за минималистично приложение?
Основа от сиви (почти бял фон, много светлосиви повърхности и почти черен текст) с един-единствен акцентен цвят за важното. Тази идея следват палитрите в категорията „Минимализъм“.
Как да прехвърля палитрата във Figma, Flutter или SwiftUI?
При палитрата щракни „Експортирай“ и избери формат: JSON токени за Figma, ColorScheme за Flutter, цветове със светъл и тъмен режим за SwiftUI, Tailwind или CSS променливи. Копираш кода с едно докосване.
