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

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

 

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

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

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

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


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

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

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

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


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

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

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

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

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

Функции

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


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

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

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

  1. Название сайта: Выберите цвет текста для заголовка вашего сайта.
  2. Задний план: Установите базовый цвет для вашего сайта.
  3. Заголовок: Установите базовый цвет для заголовка вашего сайта.
  4. Граница заголовка: Установите цвет границы для заголовка вашего сайта.
  5. Нижний колонтитул: Установите базовый цвет для нижнего колонтитула вашего сайта.
  6. Граница нижнего колонтитула: Установите цвет границы для нижнего колонтитула вашего сайта.
  7. Текст нижнего колонтитула: Установите цвет текста нижнего колонтитула вашего сайта.
  8. Overlay: Установите базовый цвет для просмотра полного изображения.
  9. Текст наложения: Установите цвет стрелок навигации, значков и других элементов в полноэкранном режиме.
  10. Карта: Установите цвет карточки для элементов динамического списка (например, списков текста/изображений), присутствующих на вашем веб-сайте. Цвет карточки применяется в качестве контура и фона для элементов списка.
  11. Граница карты: Установите цвет границы карты. Вы можете выбрать цвет по умолчанию или собственный цвет для отдельных разделов.


  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.