Подбор цвета
Happy Hues: https://www.happyhues.co/
Если вы не уверены какие цвета использовать в своих проектах и где, то данный сайт послужит реальным примером того, что и как лучше всего применить. При выборе цветовой палитры весь сайт меняет свой облик, чтобы вы наглядно могли ориентироваться.
Adobe Colour: https://color.adobe.com/ru/explore
Представлено огромное количество паллетов цветов, которые вы можете применять в своих проектах. Помимо этого вы можете скачать набор не только в качестве изображения, но и выгрузить готовый код в less, css или sass.
Color Hunt: https://colorhunt.co/
Большая база паллетов цветов. Так же предусмотрена возможность быстро скопировать нужный цвет. Большим плюсом является наличие расширения для браузера google chrome.
Brand Colors: https://brandcolors.net/
Громадная коллекция цветов брендов. При клике на цвет происходит его копирование, что весьма удобно. Частенько его использую, когда заказчик говорить что-то типа: «цвет как у скайпа».
ColorSpark: https://colorspark.app/
Простой инструмент, который генерирует случайные цвета и градиенты. Можно посмотреть, как будет выглядеть на темном и светлом фоне, а также скопировать цвет одним кликом, а градиенты в css.
Инструменты для дизайна
Figma: https://www.figma.com/
Лучший инструмент для дизайна и совместной работы над проектами. Это на мой взгляд. Однако, после ввода плагинов, приложение обрело еще большую популярность, что не может не радовать. К тому же можно использовать прямо из браузера и есть интеграция со множеством сервисов.
Adobe XD: https://www.adobe.com/uk/products/xd.html
Универсальное приложение для разработки и создания прототипов. По идее, задумка была классной, однако реализация у Adobe, как всегда через жопу. Я многое возлагал на это приложение. Однако сравнивая с предыдущим, данное вообще не конкурент в плане удобства создания макетов. Однако с прототипированием здесь получше.
Affinity Designer: https://affinity.serif.com/en-gb/designer/
Я искренне люблю данное приложение. Для моей работы оно мне заменило все векторные редакторы. Да, сверхпрофессионалам функционала будет недостаточно как для работы с вектором, так и с растром. Однако все самое необходимое тут есть. Я даже написал небольшую заметку на этот счет. Прочитать можете здесь: Affinity Designer – инструмент дизайнера без подписок
Иконки
Здесь представлены, как коллекции так и сервисы с подборками, поэтому если вы скачиваете какой-нибудь комплект, то можете использовать еще удобнее с одним очень классным приложением для менеджмента иконок о котором я не так давно сделал запись.
Feather Icons: https://feathericons.com/
Простые, красивые и аккуратные иконки, к тому же open source. Частенько использую их в своих проектах. Комплект хоть и большой, однако все по дуле тут.
Eva Icons: https://akveo.github.io/eva-icons/
Это пакет из более чем 480 аккуратно созданных иконок с открытым исходным кодом. Можно скачать их все разом либо использовать копированием прямо из браузера, что бывает удобно.
Noun Project: https://thenounproject.com/
Один из любимейших сервисов для поиска иконок. На ресурсе представлено более 2 миллионов иконок, которые курируются. Есть вариант бесплатного использования так и по подписке всего 39 долларов в год.
Ionicons: https://ionicons.com/
Премиум-иконки для использования в веб, iOS, Android и настольных приложениях. Поддержка SVG и веб-шрифта. Полностью открытый исходный код. Я же опять скачал все одной коллекцией, чтоб все было в одном месте.
CSS.gg: https://css.gg/
Очень прикольный комплект иконок на чистом css. Я теперь стараюсь все чаще использовать подобного типа коллекции, однако их не так много. На мой взгляд, эта — самая крутая из всех. Помимо этого, можно скачать в svg и других форматах. Я отдельно распишу на этот счет небольшую статью в ближайшее время.
Material Icons: https://material.io/resources/icons/
Очень большая коллекция иконок с различными режимами отрисовки, что приятно. Комплект, в целом, уже не нуждается в представлении.
Boxicons: https://boxicons.com/
Это простые векторные иконки, тщательно разработанные для дизайнеров и разработчиков чтоб комфортно использовали своих следующих проектах. Всего в коллекции 1462 иконки и 3 различных начертания. Можно скачать svg как поштучно, так и общим паком.
Iconoir: https://iconoir.com/
Библиотека простых и понятных иконок. Это развивающаяся коллекция из 2059 иконок SVG в 3 разных стилях, полностью редактируемых и настраиваемых. К сожалению для многих он платный. Стоит 12 долларов за один стиль и 29 за все.
Evericons: http://www.evericons.com/
Коллекция из более чем 460 грамотно созданных иконок для вашего следующего проекта. Все бесплатно для личного и коммерческого использования. Частенько использую их ибо есть проект в фигме со всем комплектом.
Heroicons: https://heroicons.dev/
Еще один свежий набор. Насколько я понял, используются только как SVG. Хотелось бы, конечно, и шрифт иконочный ибо в WebFlow удобнее с ним работать, однако набор полезный, даже более чем. При клике на иконку копируется в буфер SVG код. Есть шаблон для Figma
Иллюстрации
Open Peeps: https://www.openpeeps.com/
Библиотека рисованной иллюстрации. Библиотека работает как строительные блоки из векторных рук, ног и эмоций. Вы можете смешивать эти элементы, чтобы создавать разных персонажей. Звучит и выглядит действительно круто. Нашел ее не так давно и все жду, чтобы поскорее применить уже в деле.
Humaaans: https://www.humaaans.com/
Еще одна коллекция векторных людей с интересной отрисовкой. Все flat и в векторе. Полностью бесплатно для личного и коммерческого использования. Здесь удобно то, что все элементы отделены друг от друга и можно в дальнейшем создавать анимации в after effects.
Control: https://control.rocks/
Комбинированный набор из 108 настраиваемых иллюстраций c настраиваемым стилем и типами действий. Весьма интересный комплект. Использовал один раз для своего проекта и несколько раз для youtube обложек.
UnDraw: https://undraw.co/
Один из самых разрекламированных ресурсов с иллюстрациями. Это и не удивительно. Здесь очень большой комплект, удобная смена цветов быстрое скачивание. В общем, все очень интересно.
404: https://error404.fun/
Бесплатные иллюстрации для страниц 404. Есть действительно прикольные иллюстрации, однако коллекция весьма маленькая, но брать можно.
Вспомогательные ресурсы
Smart upscaler: https://icons8.com/upscaler
Автоматически увеличивайте и улучшайте изображения, используя искусственный интеллект. На практике, весьма быстрое решение. Работает приемлемо. Больше сказать нечего тут. Лично я пользуюсь постоянно. Жаль, что максимальное увеличение 3000х3000 пикселей.
Glyphy: https://www.glyphy.io/
Простой онлайн-инструмент, который позволяет легко копировать специальные символы и символы (также известные как глифы) в буфер обмена, чтобы затем можно было вставить их в любой документ или приложение. Тут представлены самые основные глифы. Частенько пользуюсь ибо бывает лень искать код. Однако в Affinity и Photoshop для этого есть отдельная панель. Однако для статей и записей будет удобно, когда нужно быстро заменить дефис на тире.
Mockups: https://originalmockups.com/
Красивые макеты для красивых дизайнов. Как платные мокапы, так и бесплатные. Подъодят исключительно для photoshop. Однако, в affinity designer и photo появилась поддержка смарт-объектов из фотошопа, поэтому мокапы можно теперь и там использовать.
Ресурсы для Figma: Быстро и одной строкой
http://figmafreebi.es/ — Коллекция дизайнерских ресурсов для сообщества figma
https://clck.ru/Nipnw — Это сообщество Figma, объединившееся для обмена ресурсами, знаниями и лучшими практиками.
PaperSizes: https://papersizes.io/ — Лучший ресурс для международных размеров бумаги, размеров и форматов. Я очень часто работаю с печатной продукцией, и никак не могу выучить все размеры, да и частенько добавляются новые ибо компания международная. Поэтому данный сервис просто находка.
Freebie: https://freebiesupply.com/ — Очень классный ресурс с бесплатными материалами практически для всех рабочих инструментов, что я использую. Здесь и макеты, и презентации, и иконки, и многое другое на все случаи жизни. Так что используйте на здоровье.
UpLabs: https://www.uplabs.com/ — Это место, где можно найти качественные дизайнерские ресурсы для дизайнеров, креативных агентств и разработчиков. Тоже не плохой ресурс, однако много платного. Очень много платного.
FreePik: https://ru.freepik.com/ — Это фото-, векто-, иконосток. Здесь вы найдете и иллюстрации и мокапы и графику и вообще все, что только можно, причем, в больштнстве случаев, бесплатно. Также есть ряд дочерних ресурсов, которые можно найти в верхнем меню.
Фотостоки
Unsplash: https://unsplash.com/ — Думаю, не нуждается в представлении. Ресурс не молодой, однако практически каждый дизайнер им пользуется если не для готового проекта, то в качестве заглушек на сайт.
Generated Photos: https://generated.photos/ — Насколько я понял, здесь сгенерированные искусственным интеллектом фотографии. Я лично лезу сюда, когда нужны аватарки.
Pexels: https://www.pexels.com/ — Бесплатный фото и видео сток. Весьма удобный и качественный. Напоминает первый из списка.
Pixabay: https://pixabay.com/ — Среди всех представленный здесь я всегда нахожу фото с максимально точным совпадением. Здесь представлено более 1.7 миллиона изображений и видео для свободного использования.
Mixkit: [https://mixkit.co/](https://mixkit.co/) — Бесплатный сток с видео клипами, стоковой музыкой и шаблонами для Premiere Pro. Пока ни разу не пользовался, однако рекомендуют. Так же есть различные арты.
Burst: [https://burst.shopify.com/](https://burst.shopify.com/) — Фотосток с бесплатными материалами от shopify. Тоже что-то свеженькое для меня. Однако пару фоток нашел. Качество реально не плохое здесь.
В заключение
Страница будет переодически расширяться. Буду стараться добавлять как минимум раз в неделю по несколько сервисов, а на некоторые буду делать отдельные записи на сайте, если будут очень интересными и/или полезными. Если что-то интересное есть у Вас, то пишите в комментариях, добавлю в списко по необходимости.
Ну и самое главное, добавляйте страницу в закладки, чтоб всегда все сайты были под рукой (Сtrl + D или CMD + D), а также делитесь в соц сетях.
