Skip to content

Latest commit

 

History

History
32 lines (27 loc) · 3.82 KB

Customize.md

File metadata and controls

32 lines (27 loc) · 3.82 KB

🎨 Настройка цветовой схемы с помощью CustomCSS

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

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

:root {
    --accent-1: hsl(25, 70%, 60%); /* Основной акцентный цвет. Используется для выделения важных элементов. */
    --accent-2: hsl(25, 70%, 48%); /* Второй акцентный цвет. Немного темнее основного акцента, для вариации оттенков. */
    --accent-3: hsl(25, 70%, 42%); /* Третий акцентный цвет. Еще темнее, для создания контраста. */
    --accent-4: hsl(25, 70%, 36%); /* Четвертый акцентный цвет. Используется для элементов, требующих минимального акцента. */
    --accent-5: hsl(25, 70%, 30%); /* Самый темный акцентный цвет. Применяется для приглушенных акцентов. */
    
    --mention: hsla(25, 80%, 52%, 0.1); /* Фоновый цвет упоминаний (mentions) с прозрачностью. */
    --mention-hover: hsla(25, 80%, 52%, 0.05); /* Фоновый цвет упоминаний при наведении мыши с большей прозрачностью. */
    
    --text-0: white; /* Основной цвет текста (самый светлый). */
    --text-1: var(--text-2); /* Дополнительный цвет текста, совпадает с --text-2. */
    --text-2: hsl(0, 0%, 70%); /* Второй по яркости цвет текста, используется для основного текста. */
    --text-3: hsl(0, 0%, 60%); /* Третий цвет текста, менее яркий, используется для второстепенного текста. */
    --text-4: hsl(0, 0%, 50%); /* Четвертый цвет текста, еще менее яркий, для вспомогательных элементов. */
    --text-5: hsl(0, 0%, 40%); /* Самый темный цвет текста, для наименее значимых элементов. */
    
    --bg-1: hsl(25, 10%, 15%); /* Основной фоновый цвет. */
    --bg-2: hsl(25, 10%, 12%); /* Второй фоновый цвет, немного темнее основного. */
    --bg-3: hsl(25, 10%, 9%); /* Третий фоновый цвет, еще темнее. */
    --bg-4: hsl(25, 10%, 5%); /* Самый темный фоновый цвет, для глубоко затенённых участков. */
    
    --hover: hsla(25, 15%, 15%, 0.1); /* Цвет фона при наведении на элементы, с прозрачностью. */
    --active: hsla(25, 15%, 15%, 0.2); /* Цвет фона для активных элементов, с большей прозрачностью. */
    --message-hover: hsla(25, 10%, 8%, 0.1); /* Цвет фона при наведении на сообщения, с небольшой прозрачностью. */
}