Редактор Wix: Настройка цветовой схемы
4 мин. чтения
Создание цветового стиля - это важный шаг в процессе дизайна сайта. При постоянном использовании эти цвета задают тон и знакомят посетителей с вашим брендом.
![](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/aab2701b-c9ef-4174-9a6c-a2358c395548/2022/02/23/3537c611-be22-4cfb-a1c3-9f549a6cef77/4ecc1dbb-c21c-453b-8afc-759b6f2e9a48.png)
Цветовая схема автоматически используется на всем сайте и в стилизованных элементах на панели «Добавить». Вы также можете применить цвета стиля к любому элементу на сайте.
Содержание:
Настройка цветовой схемы
Мы предлагаем множество преднастроенных цветовых схем, которые вы можете использовать на сайте. Эти схемы были тщательно продуманы и включают в себя идеально сочетающиеся цвета, которые охватывают целый ряд стилей, от элегантных и нежных пастельных тонов до смелых и ярких палитр. Просмотрите преднастроенные схемы и выберите вариант, подходящий для вашего бренда.
После того как вы выбрали преднастроенную цветовую схему вы можете поменять отдельные цвета схемы на свое усмотрение.
Чтобы выбрать и настроить цветовую схему:
- Нажмите Дизайн сайта
в левой части редактора.
- Наведите курсор на раздел Цвет и стиль текста и нажмите Настроить.
- Нажмите Цвета в разделе Текущий стиль.
- Наведите курсор на Цветовая схема и нажмите Заменить.
- Просмотрите пресеты стилей и выберите понравившийся.
![](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/aab2701b-c9ef-4174-9a6c-a2358c395548/2022/02/23/790bde9e-60ae-496b-aaaa-f1a08c27a698/dadff63b-b67d-4aba-8e89-061ddc0e8855.png)
- (Необязательно) Настройте цвета схемы:
- Наведите курсор на Текущий стиль и нажмите Цвета.
- Нажмите на значок Изменить цвет
рядом с нужным цветом.
- Выберите новый цвет с помощью курсора или введите точный цвет в формате HEX, RGB или HSB.
![](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/aab2701b-c9ef-4174-9a6c-a2358c395548/2022/02/23/e221cf6e-0cb5-4ac6-bb03-ae3310bc7301/cee4d54c-4bed-4c63-a269-72006db244cb.gif)
- (Необязательно) Нажмите на оттенок на цветовой шкале и настройте его по своему вкусу, установив насыщенность и яркость.
![](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/aab2701b-c9ef-4174-9a6c-a2358c395548/2022/02/23/9e2bb09e-571b-4db7-b40d-8d6ecaa6ce9e/5132d90e-befe-4b3a-bb62-db903a0198c6.png)
Применение цветовой схемы к элементам на сайте
Вы можете применить цвета схемы к любому элементу на сайте. Они сохраняются в палитре цветов в панелях дизайна:
![](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/aab2701b-c9ef-4174-9a6c-a2358c395548/2022/02/23/7a1a0ba1-b1c2-447d-8135-44a6201c225e/355c094a-c112-4e76-9c9a-675fc3c6f14c.png)
Совет:
Вы также можете сохранить в палитре цветов пользовательские цвета, которые не являются частью вашей схемы. Нажмите + Добавить рядом с Мои цвета, чтобы выбрать новый цвет.
Кроме того, стилизованные элементы внутри панели «Добавить» в редакторе (например, стилизованные кнопки, боксы и линии) уже содержат цвета вашей схемы, поэтому вам не нужно беспокоиться об их ручной настройке в соответствии со стилем сайта.
![](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/aab2701b-c9ef-4174-9a6c-a2358c395548/2022/02/23/c0592d56-c96e-437a-8743-5c3e216c9003/f109d874-a04b-41e7-91e6-19054a8fb18d.png)
Как цвета схемы используются на сайте
Цвета схемы не только отображаются в палитре цветов, но и используются на сайте следующим образом:
Цвет 1: фон и текст
Цвет 1 используется для фона и текста на сайте. Если вы добавили на свой сайт приложения Wix (например, магазин Wix Stores, Блог Wix и т. д.), на этих страницах будут использоваться одинаковые цвета фона и текста.
В большинстве случаев вы увидите, что самый яркий оттенок (1) используется для фона, а самый темный (2) - для текста. Мы рекомендуем создавать высококонтрастные пары, чтобы информацию на вашем сайте было легко читать.
![Снимок экрана, показывающий цвет 1](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/8696077d-830a-4b1e-bd86-9df98f89994a/2020/10/26/2ca80824-4f9f-4524-a006-6e66ce8659e9/13bc1893-90fa-4c3e-b137-79e21181f4e4.png)
Цвет 2: цвет действия
Побуждайте посетителей делать желаемый выбор, выбирая выделяющийся цвет действия.Этот цвет используется для элементов действия, таких как ссылки, кнопки и элементы меню. Он также появляется в тематических элементах, таких как кнопки и поля, а также на страницах, связанных с приложениями Wix (например, магазин Wix Stores, Блог Wix и т. д.)
Оттенок в середине используется чаще всего, поэтому мы рекомендуем выбрать тот, который будет в контрасте с фоном. Это гарантирует, что наиболее важные элементы вашего сайта будут доступны и заметны.
![Снимок экрана, показывающий цвет 2](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/8696077d-830a-4b1e-bd86-9df98f89994a/2020/10/26/e6de3ed8-a656-4155-89d2-d6a70872aa50/df24802f-326b-4f21-973d-1b5241cddfe4.png)
Цвета 3, 4 и 5: дополнительные цвета
Выберите три дополнительных цвета, чтобы завершить настройку цветового стиля.Они отображаются в разных местах сайта, поэтому должны соответствовать другим выбранным вами цветам и дополнять их.
![Скриншот, показывающий цвета 3, 4 и 5.](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/8696077d-830a-4b1e-bd86-9df98f89994a/2020/10/26/6d808fa0-4a54-4543-a1f3-4c3bc34fa2a3/d92ba79d-39d3-4fdb-be79-f36ca93b7b4d.png)