Привет, пикабу!

Прошло 3 месяца с первого поста про мой проект — Gradients.app, он про цвета и градиенты.

Расскажу про изменения и обновления за это время.

Вращение градиента

Вращение градиента появилось в мини-карточке, на подробной странице и при генерации нового градиента. Выбирайте нужный угол поворота и скачивайте градиент под выбранным углом. В мини-карточках градиент скачивается в размере 1920 на 1080 px.

Новый вид страницы градиента

Добавление градиента в общую ленту

Зарегистрированные пользователи могут добавить свои градиенты в общую ленту.

Сгенерируйте градиент → сохраните в профиль → перейдите в мои градиенты → отправьте в общую ленту.

Пользователю придёт письмо о добавлении в общую ленту и ссылка на градиент.

Генерация градиентов без грязных переходов

Случайная генерация градиентов теперь красивая, не появляются грязные переходы, а цвета рассчитываются по HSL модели.

Появился инструмент смешивания цветов

Можно выбрать до 4х цветов и два режима смешивания RGB и HSL.

Просто про режимы RGB и HSL:

Смешивая синий и желтый в RGB вы получите серый цвет, а в режиме HSL зеленый. В RGB между синим и желтым на цветовом круге серый цвет поэтому их сложение его и даст, а в HSL получится дуга т.к. цвета на разном уровне.

Появился генератор оттенков

Выбирайте цвет и количество оттенков от 3 до 36. Оттенки генерируются в сторону белого, серого и черного цвета.

Набор сочетаний цвета текста и фона

На мини-карточках есть цвет фона, текста и их контраст, чем он выше тем читаемость лучше.

Можно отсортировать наборы по контрасту, времени и просмотрам.

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

Генерация сочетаний цвета текста и фона

К наборам добавил генерацию и для пользователей.

Пользователь может сгенерировать все цвета случайно или каждый по отдельности. Под цветами добавлены подсказки читаемости для заголовков и обычного текста по стандартам WCAG.

Огромное спасибо за комментарии в предыдущем посте, я всё записал и уже что-то добавил.

Буду рад критике и советам.

Ссылка на сайт — https://gradients.app/ru

Спасибо, всем!

Привет, пикабу!

Делюсь своим проектом Gradients.app, занимаюсь им в свободное время и очень жду замечаний и предложений. Проект может пригодиться дизайнерам и иллюстраторам — тут про цвета и градиенты.

Набор градиентов

На сайте можно скачать градиенты разных размеров в PNG, скопировать цвета по отдельности и CSS-коды градиентов. Градиенты сортируются по цветам, скачиваниям и дате. Градиентов на сегодня 87, добавляю их самостоятельно, если у вас есть классные сочетания — буду рад их добавить.

Можно провалиться внутрь карточки градиента, там будет больше информации и разные размеры для скачивания. Для веб-дизайнера есть CSS-код градиента, а для иллюстраторов — цвета в RGB, CMYK, HEX и HSL.

Генератор градиентов

Можно делать градиенты самим: подбирать цвета, смотреть разные сочетания. Есть возможность выбрать от 1 до 5 цветов, скачивать в FHD, копировать CSS-код и рандомно менять цвета всего градиента или по отдельности.

Наборы палитр

Потом я добавил на сайт ещё один раздел — цветовые схемы. Загрузил картинки в разных стилях, с разными палитрами. Эти палитры можно использовать для оформления сайтов, графического дизайна или даже дизайна интерьеров.

Схемы можно отфильтровать по цветам и скопировать HEX-код каждого цвета палитры. На подробной странице схемы цвета применяются к небольшому web-шаблону: блоки, кнопки и другие элементы раскрашиваются под выбранную палитру.

Генератор палитры по фото

Ещё можно загрузить любую картинку или фотографию и определить палитру на ней. Изображение разбивается на 10 основных цветов. Есть подробные блоки с яркими, приглушенными, темными, светлыми и противоположными цветами. У всех цветов можно скопировать HEX-код.

Проект переведен на английский и частично на китайский язык.

Буду рад критике и идеям, может что-то вышло неудобно и непонятно.

Ссылка на сайт — https://gradients.app/ru

Спасибо, всем!