Новое в блогах

Подбор цветов для сайта: 4 бесплатных сервиса

Если нужно создать цветовую схему сайта, а брендбука нет, определиться с палитрой помогут онлайн-генераторы. Мы выбрали 4 сервиса, которые упростят и ускорят подбор цветов для дизайна веб-ресурсов.

[spoiler]
color.adobe.com
Сервис от компании Adobe, который генерирует палитру на основе заданного цвета и позволяет сохранить ее для дальнейшего использования. В интерфейсе нужно выбрать один из 10 типов палитры (монохромная, составная, комплементарная и др.), и система предложит 5 цветов с HEX-кодами в разных цветовых режимах. В оттенках можно регулировать уровень базовых цветов, контрастность. При этом, меняя настройки одного цвета, под них подтягиваются параметры остальных элементов схемы. Также инструмент позволяет извлечь цвет и градиент из готовой картинки. Еще одна фишка - можно проверить палитру на безопасность для дальтоников и посмотреть в "симуляторе дальтонизма", как оттенки выглядят при различных расстройствах цветовосприятия.

colormind.io
Этот сервис дает возможность создавать собственные палитры или выбрать шаблон. Каждый оттенок тонко настраивается. Если понравились какие-то отдельные цвета из сформированной подборки, их можно закрепить и снова запустить автоматическую генерацию - новые тона подбираются с учетом "закрепов". Также палитру можно получить на основе загруженного изображения, например, логотипа. Главный плюс - цветовую комбинацию легко оценить на демолендинге, элементы которого автоматом окрашиваются в полученные цвета.

materialpalette.com
Здесь можно выбрать 2 базовых цвета, которые тут же применяются на демонстрационной странице. Плюс формируется расширенная палитра для сайта из 8 оттенков. Ее можно скачать, как и готовую библиотеку иконок (архивом или по отдельности).

colorsafe.co
Инструмент для комбинирования цветов с учетом рекомендаций WCAG (по обеспечению доступности веб-контента). Пригодится при создании баннеров, инфографики, иконок и прочих графических элементов, где используется написание на каком-либо фоне. Как это работает? Загружается фоновый цвет, настраивается размер и жирность шрифта, устанавливается уровень соответствия рекомендациям WCAG. Под эти параметры алгоритм предлагает палитру для надписи, которая соответствует необходимому коэффициенту контрастности.

Рекомендуем попробовать эти инструменты в деле, а если с дизайном что-то пойдет не так, вы всегда можете заказать его в нашей веб-студии.

Готовые решения от веб-студии Некстайп:


Следите за нашими новинками и акциями. Подписывайтесь на нас в социальных сетях и блогах: