Цвета Discord Embed — Полный справочник цветовых кодов
Освойте цвета Discord embed с помощью hex-кодов, десятичных значений и инструментов выбора цвета. Узнайте, как использовать Discord blurple, тематические палитры и программное преобразование цветов для вебхуков и ботов.
Что такое цвета Discord Embed?
Цвета Discord embed — это вертикальные акцентные полосы, которые появляются с левой стороны встроенных сообщений. Эта цветная полоса помогает категоризировать информацию, привлекать внимание и создавать визуальную иерархию в ваших Discord-каналах. Независимо от того, создаёте ли вы бота, настраиваете вебхуки или создаёте автоматические уведомления, выбор правильного цвета embed критически важен для пользовательского опыта.
Свойство color в Discord embed принимает десятичное целочисленное значение в диапазоне от 0 до 16777215 (0xFFFFFF в шестнадцатеричной системе). Это представляет полный спектр RGB-цветов, предоставляя вам доступ к более чем 16 миллионам возможных цветов. Цвета также применяются в опросах, тредах и интерактивных кнопках.
Как работают цвета Discord Embed
API Discord использует десятичные значения цветов, а не hex-коды, с которыми вы могли быть знакомы из веб-разработки. Когда вы устанавливаете цвет embed, вы предоставляете целое число в десятичной системе, которое Discord внутренне преобразует в RGB-значения.
Например:
- Hex-цвет
#5865F2(Discord Blurple) преобразуется в десятичное5793266 - Hex-цвет
#57F287(Зелёный) преобразуется в десятичное5763719 - Hex-цвет
#ED4245(Красный) преобразуется в десятичное15548997
Это преобразование необходимо, потому что JSON изначально не поддерживает шестнадцатеричную нотацию для чисел.
Установка цветов Embed в JSON
Наиболее распространённый способ установки цветов embed — через webhook-запросы или вызовы API бота с использованием JSON:
{
"embeds": [{
"title": "Статус сервера",
"description": "Все системы работают",
"color": 5763719
}]
}
Поле color принимает только десятичные целые числа. Если вы опустите свойство color, Discord отобразит embed без цветной границы (появится как тёмно-серая полоса).
Преобразование Hex в десятичный формат
Поскольку большинство инструментов выбора цвета и дизайна используют шестнадцатеричные цветовые коды, вам нужно будет преобразовать их в десятичный формат для Discord embed.
Метод ручного преобразования
Чтобы преобразовать hex в десятичный формат вручную:
- Возьмите ваш hex-код цвета (например,
#5865F2) - Удалите символ
#:5865F2 - Преобразуйте из системы счисления base-16 в base-10
Пример: #5865F2 = (5 × 16^5) + (8 × 16^4) + (6 × 16^3) + (5 × 16^2) + (15 × 16^1) + (2 × 16^0) = 5793266
Программное преобразование
Большинство языков программирования предоставляют встроенные функции для преобразования hex в десятичный формат:
JavaScript/Node.js:
const hexColor = "#5865F2";
const decimalColor = parseInt(hexColor.replace("#", ""), 16);
console.log(decimalColor); // 5793266
// Альтернатива с использованием префикса 0x
const decimalColor2 = 0x5865F2;
console.log(decimalColor2); // 5793266
Python:
hex_color = "#5865F2"
decimal_color = int(hex_color.replace("#", ""), 16)
print(decimal_color) # 5793266
# Альтернатива
decimal_color2 = 0x5865F2
print(decimal_color2) # 5793266
Java:
String hexColor = "5865F2";
int decimalColor = Integer.parseInt(hexColor, 16);
System.out.println(decimalColor); // 5793266
C#:
string hexColor = "5865F2";
int decimalColor = Convert.ToInt32(hexColor, 16);
Console.WriteLine(decimalColor); // 5793266
Полный справочник цветовых кодов Discord
Вот подробная таблица популярных цветов Discord с их hex-кодами и десятичными значениями:
| Название цвета | Hex-код | Десятичное значение | Применение |
|---|---|---|---|
| Discord Blurple | #5865F2 | 5793266 | Брендинг, по умолчанию |
| Discord Green | #57F287 | 5763719 | Успех, онлайн-статус |
| Discord Yellow | #FEE75C | 16705372 | Предупреждения, статус отошёл |
| Discord Fuchsia | #EB459E | 15418782 | Акценты, особые события |
| Discord Red | #ED4245 | 15548997 | Ошибки, критические оповещения |
| Discord White | #FFFFFF | 16777215 | Нейтральный, светлая тема |
| Discord Black | #000000 | 0 | Минимальный, тёмная тема |
| Тёмно-серый | #23272A | 2303786 | Тонкий, фон |
| Светло-серый | #99AAB5 | 10070709 | Приглушённый, вторичная информация |
| Greyple | #99AAB5 | 10070709 | Вторичный цвет Discord |
| Тёмный почти чёрный | #2C2F33 | 2895667 | Тёмная тема Discord |
| Почти чёрный | #23272A | 2303786 | Более тёмная тема Discord |
| Аква | #1ABC9C | 1752220 | Информация, уведомления |
| Тёмная аква | #11806A | 1146986 | Глубокая информация |
| Зелёный | #57F287 | 5763719 | Успех, подтверждение |
| Тёмно-зелёный | #1F8B4C | 2067788 | Тонкий успех |
| Синий | #3498DB | 3447003 | Информация, ссылки |
| Тёмно-синий | #206694 | 2123412 | Глубокая информация |
| Фиолетовый | #9B59B6 | 10181046 | Премиум, особый |
| Тёмно-фиолетовый | #71368A | 7419530 | Глубокий премиум |
| Яркий розовый | #E91E63 | 15277667 | Внимание, яркий |
| Тёмный яркий розовый | #AD1457 | 11342935 | Глубокое внимание |
| Золотой | #F1C40F | 15844367 | Премиум, награды |
| Тёмно-золотой | #C27C0E | 12745742 | Глубокий премиум |
| Оранжевый | #E67E22 | 15105570 | Предупреждения, умеренный |
| Тёмно-оранжевый | #A84300 | 11027200 | Глубокие предупреждения |
| Красный | #ED4245 | 15548997 | Ошибки, опасность |
| Тёмно-красный | #992D22 | 10038562 | Глубокие ошибки |
| Светло-красный | #FF6B6B | 16739179 | Мягкие ошибки |
| Тёмно-синий (Navy) | #34495E | 3426654 | Профессиональный, корпоративный |
| Тёмный Navy | #2C3E50 | 2899536 | Глубокий профессиональный |
| Жёлтый | #FEE75C | 16705372 | Осторожность, предупреждения |
| Светло-жёлтый | #FFFF00 | 16776960 | Яркие предупреждения |
| Пурпурный | #E91E63 | 15277667 | Креативный, художественный |
| Голубой | #00FFFF | 65535 | Технологии, современный |
| Светло-голубой | #AFEEEE | 11529966 | Мягкие технологии |
| Бирюзовый | #1ABC9C | 1752220 | Баланс, гармония |
| Светло-бирюзовый | #40E0D0 | 4251856 | Мягкий баланс |
| Лайм | #00FF00 | 65280 | Яркий успех |
| Светло-зелёный | #90EE90 | 9498256 | Мягкий успех |
| Розовый | #FF69B4 | 16738484 | Весёлый, игривый |
| Светло-розовый | #FFB6C1 | 16758465 | Мягкий игривый |
| Коричневый | #8B4513 | 9127187 | Земляной, натуральный |
| Светло-коричневый | #D2691E | 13789470 | Мягкий земляной |
| Бежевый | #F5F5DC | 16119260 | Нейтральный, тёплый |
| Бордовый | #800000 | 8388608 | Глубокий красный, серьёзный |
| Оливковый | #808000 | 8421376 | Приглушённый, натуральный |
| Индиго | #4B0082 | 4915330 | Глубокий, таинственный |
| Фиалковый | #EE82EE | 15631086 | Креативный, уникальный |
| Коралловый | #FF7F50 | 16744272 | Тёплый, дружелюбный |
| Лососевый | #FA8072 | 16416882 | Мягкий, доступный |
| Бирюзовый (Turquoise) | #40E0D0 | 4251856 | Свежий, чистый |
| Лавандовый | #E6E6FA | 15132410 | Спокойный, мирный |
| Мятный | #98FF98 | 10027008 | Свежий, новый |
| Персиковый | #FFDAB9 | 16767673 | Тёплый, приглашающий |
| Небесно-голубой | #87CEEB | 8900331 | Открытый, воздушный |
| Стальной синий | #4682B4 | 4620980 | Профессиональный, сильный |
Популярные фирменные цвета Discord
Discord имеет специфические фирменные цвета, которые обычно используются в официальных embed и ботах сообщества:
Discord Blurple (#5865F2)
Фирменный цвет бренда Discord. Используйте его для embed общего назначения, брендинга или когда вы хотите сохранить визуальную идентичность Discord.
{
"embeds": [{
"title": "Добро пожаловать на сервер!",
"description": "Спасибо, что присоединились к нашему сообществу.",
"color": 5793266
}]
}
Discord Green (#57F287)
Идеально подходит для сообщений об успехе, подтверждений и позитивных обновлений статуса.
{
"embeds": [{
"title": "Действие выполнено успешно",
"description": "Ваши настройки сохранены.",
"color": 5763719
}]
}
Discord Red (#ED4245)
Идеален для сообщений об ошибках, критических оповещений и деструктивных действий.
{
"embeds": [{
"title": "Произошла ошибка",
"description": "Не удалось обработать ваш запрос. Пожалуйста, попробуйте снова.",
"color": 15548997
}]
}
Discord Yellow (#FEE75C)
Лучше всего подходит для предупреждений, сообщений об осторожности и индикаторов статуса отошёл.
{
"embeds": [{
"title": "Предупреждение",
"description": "Это действие нельзя отменить.",
"color": 16705372
}]
}
Тематические цветовые палитры для Embed
Создание согласованных цветовых схем для вашего бота или вебхука улучшает пользовательский опыт и узнаваемость бренда.
Палитра статусных сообщений
Используйте семантические цвета для мгновенной передачи типов сообщений:
- Успех: Зелёный (#57F287 / 5763719)
- Ошибка: Красный (#ED4245 / 15548997)
- Предупреждение: Жёлтый (#FEE75C / 16705372)
- Информация: Синий (#3498DB / 3447003)
const STATUS_COLORS = {
success: 5763719,
error: 15548997,
warning: 16705372,
info: 3447003
};
// Использование
const embed = {
title: "База данных подключена",
description: "Успешное подключение к базе данных.",
color: STATUS_COLORS.success
};
Палитра для игрового бота
Для игровых сообществ рассмотрите яркие, энергичные цвета:
- Победа: Золотой (#F1C40F / 15844367)
- Поражение: Тёмно-красный (#992D22 / 10038562)
- Повышение уровня: Фиолетовый (#9B59B6 / 10181046)
- Достижение: Оранжевый (#E67E22 / 15105570)
Профессиональная/корпоративная палитра
Для бизнес или профессиональных серверов используйте приглушённые, изысканные цвета:
- Основной: Navy (#34495E / 3426654)
- Вторичный: Стальной синий (#4682B4 / 4620980)
- Акцент: Бирюзовый (#1ABC9C / 1752220)
- Нейтральный: Тёмно-серый (#23272A / 2303786)
Сезонные палитры
Адаптируйте цвета embed к сезонам или событиям:
Весна: Мятный (#98FF98 / 10027008), Светло-розовый (#FFB6C1 / 16758465), Небесно-голубой (#87CEEB / 8900331)
Лето: Коралловый (#FF7F50 / 16744272), Бирюзовый (#40E0D0 / 4251856), Золотой (#F1C40F / 15844367)
Осень: Оранжевый (#E67E22 / 15105570), Коричневый (#8B4513 / 9127187), Тёмно-золотой (#C27C0E / 12745742)
Зима: Светло-голубой (#AFEEEE / 11529966), Лавандовый (#E6E6FA / 15132410), Стальной синий (#4682B4 / 4620980)
Соображения для тёмного режима
Большинство пользователей Discord предпочитают тёмный режим, поэтому ваши цвета embed должны быть оптимизированы для тёмных фонов.
Лучшие практики для тёмного режима
- Избегайте чисто белого (#FFFFFF / 16777215) - Он слишком резкий на тёмных фонах
- Используйте яркие цвета - Они лучше выделяются на тёмно-сером фоне
- Тестируйте контраст - Убедитесь, что текст остаётся читаемым
- Предпочитайте насыщенные цвета - Приглушённые цвета могут выглядеть блёклыми
Цвета, которые хорошо работают в тёмном режиме
- Discord Blurple (#5865F2 / 5793266)
- Яркий зелёный (#57F287 / 5763719)
- Голубой (#00FFFF / 65535)
- Пурпурный (#E91E63 / 15277667)
- Золотой (#F1C40F / 15844367)
Цвета, которых следует избегать в тёмном режиме
- Чисто чёрный (#000000 / 0) - Сливается с фоном
- Очень тёмные цвета - Низкий контраст, трудно различить
- Бледные пастельные тона - Выглядят блёклыми
Программное использование цветов
При создании ботов или интеграций вебхуков вы захотите эффективно управлять цветами в своём коде.
Пример на JavaScript/TypeScript
class EmbedColors {
// Определение цветов как шестнадцатеричных констант
static BLURPLE = 0x5865F2;
static GREEN = 0x57F287;
static YELLOW = 0xFEE75C;
static RED = 0xED4245;
static WHITE = 0xFFFFFF;
static BLACK = 0x000000;
// Преобразование hex-строки в десятичное
static fromHex(hex) {
return parseInt(hex.replace('#', ''), 16);
}
// Преобразование RGB в десятичное
static fromRGB(r, g, b) {
return (r << 16) + (g << 8) + b;
}
// Генератор случайного цвета
static random() {
return Math.floor(Math.random() * 16777215);
}
}
// Примеры использования
const successEmbed = {
title: "Успех",
color: EmbedColors.GREEN
};
const customEmbed = {
title: "Пользовательский цвет",
color: EmbedColors.fromHex("#FF6B6B")
};
const rgbEmbed = {
title: "RGB цвет",
color: EmbedColors.fromRGB(255, 107, 107)
};
Пример на Python
class EmbedColors:
BLURPLE = 0x5865F2
GREEN = 0x57F287
YELLOW = 0xFEE75C
RED = 0xED4245
WHITE = 0xFFFFFF
BLACK = 0x000000
@staticmethod
def from_hex(hex_color):
"""Преобразование hex-строки в десятичное"""
return int(hex_color.replace('#', ''), 16)
@staticmethod
def from_rgb(r, g, b):
"""Преобразование RGB-значений в десятичное"""
return (r << 16) + (g << 8) + b
@staticmethod
def random():
"""Генерация случайного цвета"""
import random
return random.randint(0, 16777215)
# Примеры использования
success_embed = {
"title": "Успех",
"color": EmbedColors.GREEN
}
custom_embed = {
"title": "Пользовательский цвет",
"color": EmbedColors.from_hex("#FF6B6B")
}
rgb_embed = {
"title": "RGB цвет",
"color": EmbedColors.from_rgb(255, 107, 107)
}
Инструменты выбора цвета для Discord Embed
Ручное преобразование hex в десятичный формат может быть утомительным. Несколько инструментов делают этот процесс проще:
Онлайн-инструменты выбора цвета
-
discord-webhook.com - Наш встроенный визуальный конструктор вебхуков включает инструмент выбора цвета, который автоматически преобразует hex в десятичный формат. Просто нажмите на селектор цвета, выберите ваш цвет, и десятичное значение применяется мгновенно.
-
Инструменты разработчика браузера - Большинство браузеров имеют инструменты выбора цвета в своих инструментах разработчика, которые отображают hex-значения, которые вы можете преобразовать.
-
Инструменты дизайна - Figma, Adobe XD и Sketch предоставляют hex-коды цветов, которые вы можете преобразовать программно.
Использование нашего визуального конструктора вебхуков
Самый простой способ работы с цветами Discord embed — использование нашего бесплатного визуального конструктора вебхуков на discord-webhook.com:
- Перейдите в приложение конструктора вебхуков
- Нажмите на селектор цвета в разделе embed
- Выберите желаемый цвет визуально
- Десятичное значение автоматически вычисляется и применяется
- Предварительный просмотр вашего embed в реальном времени
- Скопируйте сгенерированный JSON или отправьте напрямую на ваш вебхук
Это устраняет необходимость в ручном преобразовании и позволяет вам увидеть точно, как будет выглядеть ваш embed перед отправкой.
Распространённые ошибки с цветами
Прямое использование Hex-значений
Это НЕ будет работать:
{
"embeds": [{
"title": "Пример ошибки",
"color": "#5865F2"
}]
}
API Discord ожидает десятичное целое число, а не hex-строку. Всегда сначала преобразуйте в десятичный формат.
Использование недопустимых значений цвета
Значения цвета должны быть между 0 и 16777215. Значения вне этого диапазона будут отклонены:
{
"embeds": [{
"title": "Недопустимо",
"color": 99999999
}]
}
Забывание о доступности цвета
Убедитесь, что ваш выбор цвета доступен:
- Поддерживайте достаточный контраст с текстом
- Не полагайтесь только на цвет для передачи информации
- Учитывайте пользователей с дальтонизмом (избегайте красного/зелёного как единственных дифференциаторов)
Продвинутые техники работы с цветом
Эффекты, похожие на градиент, с несколькими Embed
Хотя отдельные embed не могут иметь градиенты, вы можете создать эффект градиента, используя несколько embed с постепенно меняющимися цветами:
{
"embeds": [
{
"description": "Шаг 1: Инициализация",
"color": 3447003
},
{
"description": "Шаг 2: Обработка",
"color": 5793266
},
{
"description": "Шаг 3: Завершение",
"color": 10181046
}
]
}
Динамический цвет на основе данных
Настраивайте цвета embed программно на основе значений данных:
function getColorForPercentage(percentage) {
if (percentage >= 80) return 0x57F287; // Зелёный
if (percentage >= 50) return 0xFEE75C; // Жёлтый
if (percentage >= 20) return 0xE67E22; // Оранжевый
return 0xED4245; // Красный
}
const serverLoad = 75;
const embed = {
title: "Нагрузка сервера",
description: `Текущая нагрузка: ${serverLoad}%`,
color: getColorForPercentage(serverLoad)
};
Интерполяция цвета
Создавайте плавные переходы цвета, интерполируя между двумя цветами:
function interpolateColor(color1, color2, factor) {
const r1 = (color1 >> 16) & 0xFF;
const g1 = (color1 >> 8) & 0xFF;
const b1 = color1 & 0xFF;
const r2 = (color2 >> 16) & 0xFF;
const g2 = (color2 >> 8) & 0xFF;
const b2 = color2 & 0xFF;
const r = Math.round(r1 + (r2 - r1) * factor);
const g = Math.round(g1 + (g2 - g1) * factor);
const b = Math.round(b1 + (b2 - b1) * factor);
return (r << 16) + (g << 8) + b;
}
// Интерполяция от красного к зелёному
const startColor = 0xED4245; // Красный
const endColor = 0x57F287; // Зелёный
const midColor = interpolateColor(startColor, endColor, 0.5);
Лучшие практики для цветов Discord Embed
- Будьте последовательны - Используйте одинаковые цвета для одинаковых типов сообщений в вашем боте
- Следуйте конвенциям - Зелёный для успеха, красный для ошибок, жёлтый для предупреждений
- Учитывайте брендинг - Используйте цвета бренда вашего сервера или организации, когда это уместно
- Тестируйте в тёмном режиме - Большинство пользователей используют тёмный режим, поэтому оптимизируйте для него
- Не злоупотребляйте яркими цветами - Слишком много ярких embed может быть подавляющим
- Используйте нейтральные цвета для частых сообщений - Сохраняйте яркие цвета для важных уведомлений
- Документируйте вашу цветовую схему - Ведите справочник о том, какие цвета что означают в вашем боте
- Доступность прежде всего - Убедитесь, что цвета различимы для пользователей с дальтонизмом
Заключение
Цвета Discord embed — это мощный инструмент для создания визуально привлекательных и информативных сообщений. Понимая преобразование hex в десятичный формат, используя соответствующие цветовые палитры и следуя лучшим практикам, вы можете создавать профессионально выглядящие embed, которые улучшают пользовательский опыт.
Независимо от того, создаёте ли вы бота, настраиваете вебхуки или создаёте автоматические уведомления, выбор правильных цветов помогает пользователям быстро понимать контекст и важность сообщения.
Готовы начать создавать красивые Discord embed? Используйте наш визуальный конструктор вебхуков для проектирования embed с интуитивным инструментом выбора цвета, предварительным просмотром в реальном времени и автоматическим преобразованием в десятичный формат. Не требуется программирование — просто выбирайте, нажимайте и отправляйте.
Визуальный конструктор на discord-webhook.com также поддерживает выбор цветов для опросов, интерактивных кнопок, отложенных сообщений и сообщений в тредах и форумах — всё с мгновенным предпросмотром цветовой палитры.
Похожие статьи
- Полное руководство по Discord Embed: поля, цвета, изображения, лимиты — Полная структура embed-сообщений и все возможности форматирования
- Гайд по Discord Components V2: кнопки, меню, формы в вебхуках — Интерактивные компоненты для улучшения пользовательского опыта
- Отправка Discord Webhook из JavaScript и Node.js — Программная отправка цветных embed из JavaScript
- Лучшая альтернатива Discohook — Сравнение инструментов для создания Discord вебхуков
- Конструктор опросов Discord Webhook — Создание красочных опросов через webhook
- Интерактивные кнопки и действия Discord — Добавление интерактивных элементов с настраиваемыми цветами
Попробуйте в нашем инструменте
Открыть конструктор Discord Webhook