Комплементарні кольори: занурення у світ розмаїття

Наочний гайд про поєднання контрастних кольорів з прикладами, схемами та шпаргалками щодо використання колірного кола.

Теорія кольору – захоплююча і багатогранна тема, що впливає на всі сфери мистецтва та творчості. Без неї не було б ні живопису, ні дизайну, ні стильних інтер'єрів. Поринаючи у світ відтінків і тонів, складно не зіткнутися з поняттям комплементарних кольорів. Що це означає і як ними користуватися – розберемо у статті.

Колірний круг Іттена

Ім'я Йоханнеса Іттена вписано в сучасну історію колористики і стало загальним. Саме завдяки йому – одному з ідеологів знаменитої школи Баухауз – з'явилася проста схема для роботи з кольором, хоча дослідження та систематизація колірного спектру велися задовго до цього.

Наприклад, рівні кількості жовтого та червоного, об'єднуючись, дають один із кольорів другого порядку – помаранчевий. Так само виходять фіолетовий і зелений.

Інші сектори кола Іттена заповнюють кольори третього порядку – продукт змішування первинних та вторинних. Звичайно, така ємна схема не вміщує всього багатства відтінків, доступних людському оку. Але її достатньо для того, щоб самостійно створювати гармонійні поєднання.

До речі! На базі навчальної програми Іттена для курсу в школі Баухауз вийшла його книга «Мистецтво кольору» – настільний посібник художників та дизайнерів.

Сам Іттен так писав про колірне коло: «Ця система дає можливість миттєво і точно уявити собі всі дванадцять кольорів і легко розташувати між ними всі їхні варіації».

Теорія кольору, контраст

Багато хто говорить, що колір — це суто суб'єктивна річ і в ній немає якихось правил чи принципів. Насправді ж, як і в будь-якій науці, тут є місце та теорії. Колір допомагає доповнити той зміст та ідею, які ви хочете вкласти у свою роботу, і правильне його використання допомагає зробити ваш продукт більш помітним та професійно виглядаючим.

Багато дослідників займалися питаннями кольору, і одним із найпомітніших, безперечно, був Йоханнес Іттен, автор книги «Мистецтво кольору». У своїй роботі автор розглядає безліч аспектів колористики: психологічний вплив кольору, «вага» кожного відтінку, поєднання кольору та форми та багато іншого.

Почнемо з найзрозумілішого - поєднання кольорів. Саме робота квітів у парі або групі безпосередньо впливає на перше враження від малюнка. Для цього використовується термін «контраст», тобто зіставлення двох і більше кольорів таким чином, щоб їх можна було ефективно порівняти та показати відмінності. Контраст допомагає виявити динаміку малюнка, його настрій, характер, ціль. Іттен виділяє сім основних груп контрасту:

Контраст за кольором - Одна з найпростіших схем роботи. Як йдеться у книзі Іттена, «Він виявляється у взаємодії граничної насиченості чистих кольорів. Як білий і чорний виявляють найсильніший контраст світлого і темного, так і первинні кольори, жовтий, синій і червоний, наділені властивістю найбільш сильного контрасту кольору, що створює враження простоти, сили і рішучості. Інтенсивність кольорового розмаїття слабшає від первинних — до кольорів третього порядку».

Простіше кажучи, якщо ви для своєї роботи оберете поєднання двох (бажано протилежних) кольорів, причому в їхній насиченій формі, і поставте поряд, у вас вийде дуже гучний і насичений контраст. Але головне знати міру, вміти приглушувати такі поєднання і правильно розподіляти маси. Інакше ви ризикуєте отримати дуже яскраву картинку без акценту на деталь.

Як приклад: на картинці зі стікером ви можете побачити кілька видів розмаїття, але провідний у ньому - контраст за кольором. Протиставлення червоного та синього кольорів дає дуже звучне поєднання, але щоб воно виглядало спокійніше, використані приглушені тони. Синього на малюнку більше - це створює обрамлення для тих невеликих насичених червоних плям, які можна побачити на обличчі дівчини.

Другий приклад: постер із гри Prey. Як бачите, тут використовується контраст гранично насичених кольорів, але за рахунок розподілу мас цей контраст виглядає гармонійно і в ньому чітко розставлені акценти.

Контраст світлого та темного. Здається, ця комбінація кольорів є найзрозумілішою. Вона заснована на використанні кольорів різної світло та тонових градацій кольору. Світла пляма виділятиметься в темному оточенні, як і темна пляма виділятиметься на світлому фоні.

Усі кольори можуть бути освітлені білим або затемнені чорним. Кожен колір має свій тон — це дуже легко перевірити, просто спробуйте зробити кольори на колірному колі чорно-білими. Але тут і криється головна проблема. Не всі кольори можуть планомірно ставати світлими чи темними. Деякі з них, якщо їх почати освітлювати або затемнювати, починають втрачати насиченість, і це може стати проблемою, особливо в рамках мобільного арту.Найкраще це вирішити використанням іншого кольору, а не затемненням оригінального - це допоможе уникнути примішування в картинку "бруду".

Іттен каже наступне: «Чистий жовтий колір відповідає третьому щаблі сірого кольору, помаранчевий – п'ятий, червоний – шостий, синій – восьмий, а фіолетовий – десятий. Насичений жовтий колір є найсвітлішим із чистих кольорів, а фіолетовий – найтемнішим. Тож жовтий колір, щоб збігтися з темними тонами сірої шкали, повинен приглушуватися, починаючи вже з четвертого ступеня. Чисті червоний і синій кольори розташовані більш глибоко, на відстані всього кількох щаблів від чорного та далеко від білого. Кожна домішка чорного чи білого зменшує їхню насиченість».

Отже, при створенні контрасту світлого та темного необхідно враховувати дві речі – контраст кольорів та контраст тону цих кольорів. І це дає вам контроль над тим, яку глибину зображенню ви хочете задати, і які елементи хочете виділити або засунути (хоча і тут є свої винятки про них трохи пізніше).

Розберемо все на конкретному прикладі. Погляньте на скріншот карти з гри Cut the Rope 2. Якщо перевести картинку в ч/б і проаналізувати її, то видно, що головна сюжетна доріжка - найсвітліший і найяскравіший елемент на екрані, що лежить на галявині середнього тону. Також яскраво виділяються монетки у верхній частині екрану, оскільки вони лежать на темному тлі дерев і створюють хороший контраст. Самі дерева (згори та знизу) злиті по тону в одну темну пляму з невеликою варіацією кольору – це зроблено навмисно, щоб створити потрібний фокус на екрані, але при цьому не робити його нудним. Кнопки хоч і не надто контрастують з фоном за тоном, але вони виділяються за кольором.

Контраст теплих та холодних квітівМожна сказати, що цей контраст - найпростіший. -фіолетовий та фіолетовий - «холодними». принципом, ця формула чудово працює.

Але як і скрізь, тут теж є свої нюанси. Наприклад, варто приділити увагу тому, який саме колір використовується і в якому оточенні використовується цей колір.

Візьмемо для наочності конкретні приклади. На малюнку нижче ви бачите дуже простий стікер в техніці flat colors. справа (тобто, один і той же колір може здаватися теплішим або холоднішим). оточенні різних тонів фіолетового виглядає по-різному.

Це підтверджує загальну теорію: відтінок і оточення можуть сильно вплинути на враження від кольору. Це інструмент, який важливо розуміти і вміти користуватися ним. утворюють пару теплий/холодний.

Також не варто забувати про вплив теплих і холодних тонів на зображення в цілому. І це якість робить його найважливішим образотворчим засобом у передачі перспективи та пластичних відчуттів».

Якщо коротко – холодні тони віддаляють предмет, теплі – наближають. Якщо вам важливо відбити якийсь елемент від фону - зробіть фон холодним, а елемент (кнопку, наприклад) теплим. Це дуже ефективний прийом, який використовується в мобільних іграх. Як приклад, подивіться на скріншот із гри Cut the Rope 2.

Контраст додаткових (компліментарних) кольорів. З книги Іттена: «Ми називаємо два кольори додатковими, якщо їх пігменти, змішаними, дають нейтральний сіро-чорний колір. У фізиці два хроматичні світла, які при змішуванні дають біле світло, також вважаються додатковими. Два додаткові кольори утворюють дивну пару. Вони протилежні один одному, але потребують один одного. Розташовані поруч вони максимально збуджують один одного і взаємознищуються при змішуванні, утворюючи сіро-чорний тон, як вогонь і вода. Кожен колір має лише один-єдиний колір, який є до нього додатковим».

Що ми можемо винести із цього визначення? Перше: додаткові кольори - це кольори, розташовані один навпроти одного на колі. Якщо змішати два такі кольори, вийде нейтральний сірий. Ну а якщо поставити два такі кольори поруч один з одним, вони створюватимуть дуже яскравий контраст.

Як наочний приклад можна взяти кілька пар, які підходять під дане визначення. Це жовтий та фіолетовий, жовто-оранжевий та синьо-фіолетовий, помаранчевий та синій, червоно-оранжевий та синьо-зелений, червоний та зелений, червоно-фіолетовий та жовто-зелений.

Додаткові кольори надають картині особливої ​​впевненості та звучності.При цьому, що важливо, обидва такі кольори зберігають свою інтенсивність у картині, тому вкрай важливо вміти балансувати їх по масі, щоб один колір не задавив інший.

Ще один важливий момент - кожна пара додаткових кольорів має інші характеристики. Так, пара жовтий і фіолетовий є не тільки контрастом додаткових кольорів, але й сильним контрастом світлого і темного. Червоно-жовтогарячий і синьо-зелений - це не тільки пара додаткових кольорів, але одночасно і надзвичайно сильний контраст холодного та теплого. Саме тому важливо грамотно підбирати пару таких кольорів відповідно до теми вашої картини, щоб колір посилював зміст, а не тиснув його своєю яскравістю.

Проаналізуємо приклад. За основу взято пару «червоно-жовтогарячий і синьо-зелений» — пару, яка підкреслює тему природи, пов'язаної з феєю. Зверніть увагу, як зелені крила виділяються на тлі червоно-жовтогарячого волосся і червоної шкіри. Все це допомагає створити потрібний образ та підтримувати його.

Симультанний контраст. З книги Іттена: «Поняття 'симультаний контраст' позначає явище, у якому наше око при сприйнятті будь-якого кольору відразу вимагає появи його додаткового кольору, і якщо такого немає, то симультанно (тобто одночасно) породжує його сам. Цей факт означає, що основний закон колірної гармонії базується на законі про додаткові кольори. Симультанно породжені кольори виникають лише як відчуття та об'єктивно не існують. Вони не можуть бути сфотографовані. Симультанний контраст, як і послідовний контраст, ймовірно, виникає з однієї й тієї причини».

Якщо говорити простіше, то симультанним контрастом називають таке поєднання кольорів, при якому в наших очах відбувається спотворення реальної інформації кольорів і породження нового кольору (або спотворення поточного), якого немає на малюнку. Цей ефект проявляється при використанні двох не прямо додаткових кольорів.

Цей ефект важко пояснити, оскільки його неможливо зафіксувати, але спробуємо розглянути його на прикладі. Зверніть увагу на шкіру дівчини, особливо на колір шкіри в тіньовій частині обличчя, прямо біля волосся. Як ви вважаєте, який це колір? Якщо ви думаєте, що це якийсь відтінок зеленого, то ви помиляєтеся - це зовсім не так. Це середньонасичений відтінок помаранчевого. А ось ті зелені пасма на волоссі на маківці? Це темний варіант жовтого. Голова йде кругом, правда?

Це контраст, створюваний оточенням. Сірий на тлі теплої шкіри здаватиметься або синюватим, або зеленим, приглушений помаранчевий на тлі червоного здаватиметься зеленим і т.д. Імпресіоністи, як ніхто інший, розуміли цінність цього розмаїття, і активно використовували його у своїх роботах. Тож будьте обережні, спостережливі, і спробуйте вивчати вплив квітів один на одного через малюнок.

Контраст за насиченістю. З книги Іттена: «Слова 'контраст за насиченістю' фіксують протилежність між кольорами насиченими, чистими та бляклими, приглушеними. Спектральні кольори, отримані заломленням білого світла, є кольорами максимальної насиченості або максимальної чистоти. Серед пігментних кольорів ми також маємо кольори максимальної насиченості. Щойно чисті кольори затемнюються або освітлюються, вони втрачають свою насиченість».

Тобто контраст за насиченістю - це контраст кольорів, що відрізняються за рівнем чистоти. Наприклад, можна використовувати пару яскраво-червоного та середньонасиченого жовтого, і це буде вважатися контрастом за насиченістю. Або можна приглушити всю гаму малюнка, тримаючи його в рамках середньонасичених кольорів, і виділити якісь особливо цікаві елементи яскравим насиченим кольором. Такий тип розмаїття особливо гарний виділення певних точок інтересу.

Як можна приглушити кольори? У традиційному живописі зробити це можна шляхом додавання чорного, білого, сірого та додаткового кольору до основної суміші. У цифровому живописі (зокрема, у Photoshop) є багато інших корисних інструментів — Vibrance, Photo filter, Hue/saturation, Exposure тощо.

Але питається, навіщо взагалі приглушувати кольори? Справа в тому, що коли на картинці все рівнонасичено, буває складно побачити ієрархію об'єктів на картинці, і очі глядача розбігаються. Подивіться на картинку нижче. На цьому дуже стриманому в плані кольору скетчі персонажа ми бачимо, як на тлі ненасиченої у світлі бороди виділяється насичена кольорова тінь цієї ж бороди. Або як на тлі середньонасиченої тіні очей виділяються жовті більш насичені зіниці. Більш насичений шрам на обличчі також виділяється на тлі середньонасиченої шкіри. Все це допомагає правильно розставити акценти на картинці та донести важливі для опису персонажа деталі.

Контраст за площею кольорових плям. З книги Іттена: «Контраст за площею кольорових плям характеризує розмірні співвідношення між двома або кількома плямами. Його сутність - протиставлення між 'багато' і 'мало', 'великий' і 'маленький'».

Іттен так само каже, що кожен колір має свою «вагу», і якщо вимірювати кольори за шкалою від 1 (найтемніший) до 10 (найсвітліший), то ми отримаємо ось таку таблицю: жовтий — 9, помаранчевий — 8, червоний - 6, фіолетовий - 3, синій - 4, зелений - 6. Щоб правильно побудувати взаємини кольорів на картині, потрібно грамотно розподіляти ці маси. Якщо ми беремо фіолетовий і жовтий, то бачимо, що фіолетовий - 3, а жовтий - 9. Щоб маси виглядали гармонійно і не переважували один одного, потрібно привести їх до правильного співвідношення - з 3/9 ми отримаємо 1/3, а це означає , що на одну частину фіолетового має припадати три частини жовтого.

Сгармонізовані у своїх розмірах кольорові плями справляють враження спокою та стійкості. Контраст за площею кольорових плям у цьому випадку нейтралізується завдяки гармонійно складеним кольоровим плямам.

Якщо потрібно порушити гармонію і створити різкий контраст, доведеться використовувати інші співвідношення. Головне, щоб вибір відповідав настрою та характеру картини.

Представлена ​​система кількісних співвідношень має силу тільки при використанні кольорів у їх максимальній насиченості. При зміні змінюються і відповідні розміри колірних плям. Обидва чинники — і насиченість, і розмір колірної плями — тісно пов'язані між собою.

Головне, про що в жодному разі не можна забувати - це важливість розуміння того, що знання про колір потрібно підкріплювати і аналізом чужих робіт, і читанням теорії, і практикою. Без цього дуже складно зрозуміти суть явища кольору та почати грамотно його використовувати.