Преобразуване на цветове
#e24826
≈ Cinnabar
Вариации
Целта на този раздел е да се получат точни оттенъци (добавяне на чисто бяло) и нюанси (добавяне на чисто черно) на избрания от вас цвят със стъпка от 10%.
Професионален съвет: Използвайте нюанси за състояния на курсора и сенки, а нюанси - за светлини и фонове.
Нюанси
По-тъмни варианти, създадени чрез добавяне на черно към основния цвят.
Оттенъци
По-светли варианти, създадени чрез добавяне на бяло към основния цвят.
Общи случаи на употреба
- • Състояния на компонента на потребителския интерфейс (надпис, активен, изключен)
- • Създаване на дълбочина със сенки и светлини
- • Изграждане на последователни цветови системи
Съвет за системата за проектиране
Тези вариации са в основата на цялостна цветова палитра. Експортирайте ги, за да поддържате последователност в целия си проект.
Комбинации от цветове
Всяка хармония има свое настроение. Използвайте хармониите, за да измислите цветови комбинации, които работят добре заедно.
Как да използвате
Щракнете върху всеки цвят, за да копирате неговата шестнадесетична стойност. Тези комбинации са математически доказани и създават визуална хармония.
Защо това е важно
Цветовите хармонии създават баланс и предизвикват определени емоции в дизайна ви.
Допълнение
Цвят и неговата противоположност в цветното колело, +180 градуса нюанс. Висок контраст.
Разделено-комплементарно
Един цвят и два съседни на неговото допълнение, на +/-30 градуса оттенък от стойността, противоположна на основния цвят. Удебелен като право допълнение, но по-гъвкав.
Триадичен
Три цвята, разположени равномерно по цветното колело, на 120 градуса оттенък един от друг. Най-добре е един цвят да доминира, а останалите да се използват като акценти.
Аналогичен
Три цвята с еднаква яркост и наситеност, чиито нюанси са съседни на цветното колело, на 30 градуса един от друг. Плавни преходи.
Монохромен
Три цвята с един и същи оттенък със стойности на яркост +/-50%. Фини и изискани.
Тетрадичен
Два комплекта допълващи се цветове, разделени от 60 градуса нюанс.
Принципи на теорията на цветовете
Баланс
Използвайте един доминиращ цвят, подкрепете го с втори и акцентирайте пестеливо.
Контраст
Осигурете достатъчен контраст за четливост и достъпност.
Хармония
Цветовете трябва да работят заедно, за да създадат единно визуално изживяване.
Проверка на контраста на цветовете
Тествайте цветовите комбинации, за да се уверите, че отговарят на стандартите за достъпност на WCAG за четливост на текста.
Цвят на текста
Цвят на фона
Контраст
Стандарти WCAG
Разширена проверка на контраста
Фина настройка с плъзгачи, множество визуализации и други
Всеки е гений. Но ако съдите рибата по способността ѝ да се катери по дърво, тя ще прекара целия си живот вярвайки, че е глупава.