Цвета веб-сайта – использование цветовых палитр

Выбор правильных цветов веб-сайта имеет решающее значение для создания визуально привлекательного и целостного дизайна, который эффективно передает послание бренда и улучшает взаимодействие с пользователем.

 

В этой статье:

  1. Текущая цветовая палитра
  2. Пресеты цветовой палитры
  3. Расширенное редактирование
  4. Сбросить пользовательские настройки

Вы можете управлять цветами вашего сайта из Дизайн (1) раздел.

Как только вы окажетесь в разделе «Дизайн», нажмите Цвета (2) вкладка.


Текущая цветовая палитра

  • Выбранный Цветовая палитра (1) будет отображаться здесь.
  • Вы можете настроить (2) выберите каждый из вариантов в палитре и выберите цвета в соответствии со своими предпочтениями.
  • Вы увидите пять вариантов цвета: «Фон» (3), «Нейтральный» (4), «Акцент» (5), «Темный акцент» (6) и «Текст» (7). Эти параметры определяют общую палитру.

Примечание: После внесения пользовательских настроек в параметры цветовой палитры или расширенное редактирование вы увидите кнопку «Изменено» (8).

Ниже приведен список элементов, которые влияют на внесение изменений в отдельные параметры палитры:


Пресеты цветовой палитры

Пресеты цветовой палитры (1) — это заранее определенные комбинации цветов, которые тщательно подобраны, чтобы предоставить вам быстрый и удобный способ придать вашему веб-сайту особый вид.

Вы можете легко изменить цвета вашего веб-сайта, изменив предустановки. Он будет применяться глобально на вашем веб-сайте.

Вы можете FМСДЭНИ (2) список, выбрав настройки «Все», «Светлый», «Темный» или «Жирный». После выбора фильтра вы увидите только связанные палитры.

Чтобы выбрать Цветовая палитра (3), вам просто нужно нажать на него и Опубликовать (4) изменения.

Tип

Вы можете переопределить настройки палитры по умолчанию, настроив Варианты цветовой палитры или Расширенное редактирование


Расширенное редактирование

Из Расширенного редактирования вы можете настроить цвет каждого отдельного элемента вашего веб-сайта, что дает вам полный ручной контроль над его эстетикой. В разделе ?Расширенное редактирование вы найдете следующие опции:


Варианты цвета сайта

  1. Название сайта: Выберите цвет текста для заголовка вашего сайта.
  2. Предыстория сайта: Установите базовый цвет для вашего сайта.
  3. Фон заголовка: Установите базовый цвет для заголовка вашего сайта.
  4. Граница заголовка: Установите цвет границы для заголовка вашего сайта.
  5. Фон нижнего колонтитула: Установите базовый цвет для нижнего колонтитула вашего сайта.
  6. Граница нижнего колонтитула: Установите цвет границы для нижнего колонтитула вашего сайта.
  7. Нижний колонтитул Заголовок сайта: Выберите цвет текста для заголовка сайта, отображаемого в нижнем колонтитуле вашего сайта.
  8. Текст нижнего колонтитула: Установите цвет текста нижнего колонтитула вашего сайта.
  9. Меню нижнего колонтитула при наведении: Установите цвет пунктов меню нижнего колонтитула при наведении курсора.


Варианты цвета лайтбокса

  1. Задний план: Установите цвет фона (наложения), который будет отображаться при просмотре изображений в режиме лайтбокса.
  2. Текст/Элементы: Установите цвет стрелок навигации, значков и других элементов в полноэкранном режиме.


Вариант цвета карт

  1. Задний план: Установите цвет карточки для элементов динамического списка (например, списков текста/изображений), присутствующих на вашем веб-сайте. Цвет карточки применяется в качестве контура и фона для элементов списка.
  2. Граница: Установите цвет границы карты. Вы можете выбрать цвет по умолчанию или собственный цвет для отдельных разделов.


  1. Текст меню: Установите цвет текста для пунктов меню навигации.
  2. Текст меню при наведении: Выберите цвет текста для пунктов меню, наведя на них курсор.
  3. Текст меню активен: Выберите цвет текста активного меню.
  4. Текст раскрывающегося меню: Укажите цвет текста пунктов раскрывающегося меню.
  5. Текст выпадающего меню при наведении: Выберите цвет при наведении для пунктов раскрывающегося меню.
  6. Текстовая основа раскрывающегося меню: Выберите базовый цвет для пунктов раскрывающегося меню.


Параметры цвета текста

  1. Заголовок (H1): Выберите цвет шрифта для заголовка (H1).
  2. Заголовок (H2): Выберите цвет шрифта для заголовка (H2).
  3. Заголовок (H3): Выберите цвет шрифта для заголовка (H3).
  4. Заголовок (H4): Выберите цвет шрифта для заголовка (H4).
  5. Текст абзаца: Выберите цвет шрифта для всего текста абзаца (P Normal, P Small и P Large).


  1. Кнопки: Здесь выберите цвет фона кнопок.
  2. Текст кнопок: Выберите цвет текста кнопки.
  3. Текст ссылки: Установите цвет текста ссылки для всех ссылок на сайте.
  4. Текст ссылки при наведении: Установите цвет при наведении текста ссылки для ссылок на веб-сайте.


Сбросить пользовательские настройки

Вы можете легко восстановить настройки палитры по умолчанию, если вы внесли изменения в акцентные цвета, отредактировав палитру или настроив параметры цвета в расширенном редактировании.

Вы увидите кнопку «Изменено». Наведите курсор на кнопку, она изменится на Reset. Отсюда вы можете сбросить изменения до исходных.


Не можете найти то, что ищете?

Свяжитесь с экспертом Pixpa.

Pixpa Studio только что обновили. В данный момент мы обновляем скриншоты всех справочных статей.