Желтый — значение, палитры, дополнительные цвета и гармонии
Практическое руководство по цвету желтый: символизм и психология, цветовой круг отношения (дополнительные, аналогичные, триадические), доступный цветовые сочетанияи загружаемые палитры. Конвертировать между шестигранник, RGB, и ХСЛ, копируйте переменные CSS и просматривайте соответствующие цвета, которые сочетаются друг с другом.
Совет: нажмите Входить внутри любого поля, чтобы обновить все значения.
Желтый с первого взгляда
Желтый сигнализирует о солнечном свете, тепле, любопытстве и оптимизме. Он отлично подходит в качестве акцентного цвета для выделения призывов к действию, ценников и предупреждений. Для длительного чтения отдавайте предпочтение более мягким оттенкам для комфорта.
Чистый желтый имеет низкий контраст с белым. Для обеспечения доступного пользовательского интерфейса поместите желтый цвет на темно-синий, угольный или темно-фиолетовый. Используйте черный или темно-серый текст на бледно-желтом фоне.
Желтые палитры
Автоматически генерируется оттенки (более белый), оттенки (более черный) и тона (более серый) от текущего желтого. Щелкните любой образец, чтобы скопировать HEX. Вы также можете скачать палитру PNG.
Оттенки
Оттенки
Тоны
Гармония цветового круга
Исследовать дополнительный цветовые пары, аналогичный соседи и триадный комплекты из этого желтого цвета. Эти готовые комбинации помогут вам найти цвета, которые хорошо сочетаются друг с другом.
Противоположные цвета на цветовом круге создают высокий контраст для призывов к действию и значков.
Соседи на колесе кажутся гармоничными — отлично подходят для фона и градиентов.
Три равномерно расположенных оттенка обеспечивают сбалансированный контраст для информационных панелей и диаграмм.
Приложения и лучшие практики
Брендинг
Желтый добавляет дружелюбия и энергии розничным, продуктовым, детским и туристическим брендам. Сочетайте его с угольным или темно-синим цветом для профессионального баланса и читаемой типографики.
Пользовательский интерфейс и доступность
Используйте желтый цвет в качестве акцента для кнопок и выделения. Для длинного контента выбирайте бледные оттенки в качестве фона с темным текстом, чтобы обеспечить контрастность WCAG.
Маркетинг и упаковка
Желтый привлекает внимание на полках и в социальных сетях. Дополняющие друг друга синие или фиолетовые оттенки создают эффектные главные разделы и карточки товаров.
Функции
- Мгновенный HEX ↔ RGB ↔ HSL конвертация и синхронизация.
- Автоматические палитры: оттенки, тени, тона, а также загружаемая палитра PNG.
- Гармонии цветового круга: дополнительные, аналогичные, триадные предложения.
- Быстрый CSS-переменные экспорт для систем проектирования.
Как использовать
- Введите шестнадцатеричный код (например.
#FFD600) или значения RGB/HSL и нажмите Входить. - Щелкните любой образец, чтобы скопировать его HEX. Используйте дополнительные или триадные наборы для сильного контраста.
- Загрузите палитру в формате PNG или скопируйте переменные CSS и вставьте их в свой проект.
- Ознакомьтесь с советами по контрастности, чтобы текст оставался читаемым на светло-желтых интерфейсах.
Часто задаваемые вопросы
Какие цвета хорошо сочетаются с желтым?
Темно-синий, угольный, темно-фиолетовый и насыщенный лесной зеленый прекрасно сочетаются. Для ярких акцентов используйте дополняющие друг друга голубо-синий или фиолетовый.
Какой цвет противоположен желтому?
На колесе RGB/HSL противоположный оттенок близок к сине-голубой (около 180° от оттенка желтого).
Могу ли я использовать желтый цвет для основного текста?
Обычно нет на светлом фоне. Оставьте желтый цвет для выделения или значков; вместо этого используйте темный текст на бледно-желтой карточке.