Раздел Наука

Раздел Наука

Цветовое оформление

Цветовая палитра раздела Наука

noroot.jpg

Главный цвет

#3FF8831 — основной оранжевый цвет раздела Наука. Используется для главных элементов интерфейса, выделения активных состояний и подчеркивания научной направленности раздела. Этот цвет символизирует инновации, энергию и прогрессивный подход к научным исследованиям.

Типографика и иконки

Основной цвет текста

#000000 — основной черный цвет для текста. Обеспечивает максимальную читаемость и контраст на светлом фоне. Используется для заголовков, основного текста и важных элементов интерфейса.

#222222 — темно-серый. Используется для основного текста, когда нет необходимости в максимальном контрасте.

#FFFFFF — белый. Используется для текста на темном фоне и акцентных элементов.

#FF8831 — яркий оранжевый. Используется для выделения ключевой информации, интерактивных элементов и создания акцентов. Применяется для привлечения внимания к важным и интерактивным элементам.

Второстепенные цвета текста

#E96300 — насыщенный оранжево-красный. Используется для активных табов и выделения текущего раздела навигации.

#4F9FAF — бирюзово-синий. Применяется для дополнительных табов и создания визуального разнообразия в интерфейсе. Этот цвет символизирует глубину научного анализа и многогранность исследовательской деятельности.


Интерактивные элементы

Ссылки и кнопки

#FFFFFF — белый. Используется для текста на кнопках с темным фоном и интерактивных элементах с высоким контрастом. Обеспечивает максимальную четкость и видимость важных элементов управления.

#000000 — черный. Используется для кнопок действия первого порядка на светлом фоне. Белые кнопки (#ffffff) также могут применяться для кнопок действия первого порядка, особенно на темном фоне.

#222222 — темно-серый. Используется когда нет необходимости в максимальном контрасте.

Фоновые цвета

#FFFFFF — белый. Основной фоновый цвет для страниц и контента. Создает чистое, профессиональное пространство для научной информации.

#1C414D — темный сине-зеленый. Используется для создания контрастных секций и выделения важных блоков информации. Этот глубокий цвет отражает фундаментальность научного подхода и академическую строгость.

Элементы над фоном

#FFFFFF — белый (на контрастном фоне). Используется для текста и элементов на темных фонах для обеспечения максимальной читаемости.

#FFFFFF (прозрачность 8%) — слегка прозрачный белый. Применяется для создания тонких световых акцентов и визуального разделения блоков информации.

#FFE4BF — светлый персиковый. Применяется для выделения блоков с важной научной информацией, статистикой и достижениями. Создает теплый, приветливый акцент, делающий научные данные более доступными.

#DCE4E6 — светлый мятный. Используется для информационных панелей, карточек и блоков с дополнительными данными. Этот спокойный цвет способствует восприятию сложной научной информации.

#E3EEF1 — светло-лавандовый. Применяется для выделения исследовательских проектов и образовательных материалов. Создает утонченный акцент, подчеркивающий инновационность научных подходов.

#E96300 — насыщенный оранжевый. Используется для обозначения активного раздела, текущего таба и для выделения ключевых элементов текста и блоков.

Обводки и разделители

#B2DCD7 (прозрачность 16%) — полупрозрачный светло-зеленый. Используется для тонких разделителей и границ между секциями контента.

#FFFFFF — белый (на контрастном фоне). Применяется для обводки элементов на темных фонах, обеспечивая четкость границ и улучшая визуальное восприятие компонентов интерфейса.

Рекомендации и примеры использования

Доступность

При использовании цветов важно учитывать их контрастность для обеспечения доступности интерфейса:
  • Пример: используйте основной черный текст (#000000) на белом фоне (#ffffff) для максимальной читаемости.
  • При размещении текста на оранжевом или темном сине-зеленом фоне убедитесь, что используется белый цвет (#FFFFFF) для сохранения хорошего контраста.
  • Не полагайтесь только на цвет для передачи информации — дополняйте его иконками или текстом.

Состояния интерактивных элементов (Пример)

Для обозначения различных состояний интерактивных элементов рекомендуется:
  • Обычное состояние: основной оранжевый (#3FF8831)
  • Наведение: яркий оранжевый (#fe8834)
  • Нажатие: насыщенный оранжево-красный (#ef6703)
  • Неактивное состояние: светлый мятный (#deeeed) с текстом второстепенного цвета

Иерархия информации

Правильное использование цветовой палитры помогает создать четкую иерархию информации:
  • Используйте основной оранжевый (#3FF8831) для ключевых элементов и основных действий.
  • Применяйте бирюзово-синий (#4F9FAF) для второстепенной информации и альтернативных действий.
  • Используйте светлый персиковый фон (#FFE4BF) для выделения важных научных данных и достижений.
  • Применяйте разделители для визуального структурирования контента с учетом его научной значимости.