Почему рунам нужны цвета?
- Символизм. Цвет усиливает архетипическое значение руны (например, красный – сила, зелёный – рост).
- Запоминание. Яркие визуальные ассоциации ускоряют обучение.
- Техническая реализация. При создании сайтов, игр или приложений удобно задавать цвет руны в виде HEX‑кода.
- Гармония. Правильно подобранные сочетания позволяют создать эстетически приятный дизайн.
Как выбирать цвет для руны?
- Исследовать традицию. В скандинавской, германской и кельтской традициях уже есть устоявшиеся ассоциации (например, Тюр – серебро, Феху – зелёный).
- Учесть психологию цвета. Красный – энергия и агрессия, синий – спокойствие и мудрость, жёлтый – радость и интеллект.
- Подобрать конкретный оттенок. Используйте готовые палитры (Pantone, RAL) или онлайн‑инструменты, чтобы получить HEX, RGB и HSV.
- Тестировать на разных фонах. Учитывайте контрастность: для светлого фона выбирайте более насыщенные цвета, для тёмного – более светлые.
Таблица цветов для основных рун Старшего Футарка
Ниже представлена рекомендация по цветам для 24‑х рун Старшего Футарка. Для каждой руны указаны:
- Название руны (англ. и рус.)
- Краткое значение
- Цвет (название, HEX, RGB, HSV)
| Руна | Значение | Цвет (HEX) | RGB | HSV | Пример CSS |
|---|---|---|---|---|---|
| ᚠ – Феху (Fehu) | Изобилие, богатство, материальная удача | #E5B33D (Персиковый Пух – Pantone 13-1023) | 229, 179, 61 | 38°, 73%, 90% | .rune-fehu { color:#E5B33D; } |
| ᚢ – Уруз (Uruz) | Сила, энергия, физическое здоровье | #801818 (Фалунский красный) | 128, 24, 24 | 0°, 81%, 50% | .rune-uruz { color:#801818; } |
| ᚦ – Турисаз (Thurisaz) | Защита, граница, мощный удар | #423937 (Смоляной) | 66, 57, 55 | 12°, 17%, 26% | .rune-thurisaz { color:#423937; } |
| ᚨ – Ансуз (Ansuz) | Коммуникация, вдохновение, божественное слово | #BA55D3 (Умеренный фиолетовый – Medium Orchid) | 186, 85, 211 | 280°, 60%, 83% | .rune-ansuz { color:#BA55D3; } |
| ᚱ – Райдо (Raido) | Путешествия, движение, прогресс | #4A90E2 (ярко‑синий, подходит для «путешествия») | 74, 144, 226 | 213°, 67%, 89% | .rune-raido { color:#4A90E2; } |
| ᚲ – Кано (Kaunan) | Трансформация, огонь, кристальная ясность | #B55489 (Фанданго) | 181, 84, 137 | 336°, 54%, 71% | .rune-kaunan { color:#B55489; } |
| ᚷ – Гебо (Gebo) | Подарок, партнерство, баланс | #7F7F7F (средний серый – ахроматический) | 127, 127, 127 | 0°, 0%, 50% | .rune-geb { color:#7F7F7F; } |
| ᚹ – Вундо (Wunjo) | Радость, счастье, гармония | #F5D76E (солнечный жёлтый) | 245, 215, 110 | 48°, 55%, 96% | .rune-wunjo { color:#F5D76E; } |
| ᚺ – Хагалаз (Hagalaz) | Разрушение, перемены, естественный порядок | #000000 (чёрный – ахроматический) | 0, 0, 0 | 0°, 0%, 0% | .rune-hagalaz { color:#000000; } |
| ᚾ – Науз (Nauthiz) | Трудности, необходимость, выживание | #543964 (Умеренный фиолетовый) | 84, 57, 100 | 274°, 43%, 39% | .rune-nauthiz { color:#543964; } |
| ᛁ – Иса (Isa) | Остановка, холод, статичность | #FFFFFF (белый – ахроматический) | 255, 255, 255 | 0°, 0%, 100% | .rune-isa { color:#FFFFFF; } |
| ᛃ – Йера (Jera) | Цикл, урожай, вознаграждение за труд | #8B5E3C (коричневый «земляной») | 139, 94, 60 | 25°, 57%, 55% | .rune-jera { color:#8B5E3C; } |
| ᛈ – Перт (Perthro) | Тайна, судьба, скрытое | #2E2B5F (тёмно‑синий, почти индиго) | 46, 43, 95 | 242°, 55%, 37% | .rune-perthro { color:#2E2B5F; } |
| ᛉ – Алгиз (Algiz) | Защита, высота, духовный рост | #00A86B (зелёный «мятный») | 0, 168, 107 | 161°, 100%, 66% | .rune-algiz { color:#00A86B; } |
| ᛊ – Соулу (Sowilo) | Свет, победа, жизненная сила | #FFD700 (золотой) | 255, 215, 0 | 51°, 100%, 100% | .rune-sowilo { color:#FFD700; } |
| ᛏ – Тейваз (Tiwaz) | Справедливость, отвага, битва | #C1440E (огненно‑красный) | 193, 68, 14 | 15°, 93%, 76% | .rune-tiwaz { color:#C1440E; } |
| ᛒ – Беркана (Berkano) | Род, рост, женская энергия | #4CAF50 (зелёный «листвяной») | 76, 175, 80 | 122°, 57%, 69% | .rune-berkano { color:#4CAF50; } |
| ᛖ – Эваз (Ehwaz) | Партнёрство, движение, доверие | #5A9BD4 (светло‑голубой) | 90, 155, 212 | 208°, 58%, 83% | .rune-ehwaz { color:#5A9BD4; } |
| ᛗ – Манназ (Mannaz) | Человек, общество, самосознание | #C0C0C0 (серебристый) | 192, 192, 192 | 0°, 0%, 75% | .rune-mannaz { color:#C0C0C0; } |
| ᛚ – Лагуз (Laguz) | Вода, интуиция, поток сознания | #00BFFF (ярко‑голубой «морская волна») | 0, 191, 255 | 195°, 100%, 100% | .rune-laguz { color:#00BFFF; } |
| ᛜ – Ингуз (Ingwaz) | Завершение, плодородие, внутренний покой | #8B4513 (коричневый «дерево») | 139, 69, 19 | 25°, 86%, 55% | .rune-ingwaz { color:#8B4513; } |
| ᛞ – Дагаз (Dagaz) | Пробуждение, рассвет, новый путь | #FFFAF0 (мягкий кремовый) | 255, 250, 240 | 40°, 6%, 100% | .rune-dagaz { color:#FFFAF0; } |
| ᚪ – Одал (Odal) | Наследие, дом, традиции | #654321 (тёмный коричневый) | 101, 67, 33 | 30°, 67%, 40% | .rune-odal { color:#654321; } |
| ᚫ – Эйваз (Eihwaz) | Стойкость, защита, дерево‑мост | #4B4B4B (темно‑серый) | 75, 75, 75 | 0°, 0%, 29% | .rune-eihwaz { color:#4B4B4B; } |
| ᚣ – Йер (Yr) | Сезонный цикл, перемена, время | #C96C5D (мягкий терракотовый) | 201, 108, 93 | 12°, 54%, 79% | .rune-yr { color:#C96C5D; } |
Для веб‑разработки удобно использовать стандартные форматы:
- HEX – короткая запись
#RRGGBB(например,#E5B33D). - RGB – функция
rgb(255, 215, 0)(для прозрачных элементовrgba). - HSV – редко используется напрямую, но полезен в графических редакторах.
- CSS‑переменные – удобно хранить палитру в корне:
:root {
--rune-fehu: #E5B33D;
--rune-uruz: #801818;
/* … остальные переменные … */
}
.rune { font-weight: bold; }
.rune-fehu { color: var(--rune-fehu); }
В SVG‑файлах цвет задаётся атрибутом fill:
<svg width="64" height="64">
<path d="M10,10 L54,10 L54,54 L10,54 Z"
fill="#BA55D3" /> <!-- Medium Orchid – Ансуз -->
</svg>
Гармония цветов рунической палитры
Чтобы руны выглядели эстетично в наборе, используйте один из классических методов подбора сочетаний:
- Аналоговые – выбирайте соседние оттенки по цветному кругу (пример: Феху – Персиковый Пух, Тейваз – Оранжево‑красный, Алгиз – Зелёный).
- Контрастные (дополняющие) – противоположные цвета (например, Софо – золотой
#FFD700и Хагалаз – чёрный). - Триадные – три равномерно распределённых по кругу оттенка:
#E5B33D(Персиковый),#00A86B(Алгиз),#4A90E2(Райдо).
Для быстрой проверки контрастности можно воспользоваться WebAIM Contrast Checker. Минимальное соотношение для обычного текста – 4.5:1, для крупных заголовков – 3:1.
Часто задаваемые вопросы
Какие цвета лучше использовать для темных тем?
Для UI в темных темах предпочтительны светлые, но не слишком яркие оттенки: #F5D76E (жёлтый), #BA55D3 (фиолетовый), #00BFFF (голубой). Они обеспечивают достаточный контраст с фоном #1E1E1E.
Можно ли менять цвет руны в зависимости от её «состояния»?
Да. Часто используют две палитры: основной (для обычного состояния) и активный (при наведении, клике). Пример CSS:
.rune-fehu {
color: var(--rune-fehu);
transition: color 0.2s;
}
.rune-fehu:hover {
color: #FFCC00; /* ярче, «активный» */
}Нужны ли ахроматические цвета?
Ахроматические (белый, серый, чёрный) часто используют для фона, границ, текста‑подсказок и для рун, где важна нейтральность (например, Гебо – баланс).
Подбор цвета для каждой руны – это сочетание традиций, психологии цвета и технических требований. Правильно выбранный оттенок усиливает смысл руны, облегчает запоминание и делает дизайн более гармоничным. Воспользуйтесь таблицей выше, адаптируйте её под свои проекты и не забывайте проверять контрастность, особенно если планируете использовать руны в пользовательском интерфейсе.
Если у вас возникнут вопросы по конкретным оттенкам или их применению в коде, смело задавайте их в комментариях – будем разбирать вместе!