Бесплатные иконки, шрифты и палитры для сайта: один список

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

Поэтому ещё до того, как описывать вёрстку, я открываю одну страницу, беру оттуда три-четыре вещи, и только после этого говорю агенту, что строить.

Авторы называют это подборкой качественных ресурсов и инструментов, которыми UI/UX-дизайнеры пользуются в повседневной работе, и это похоже на правду. Список — одна длинная страница, разбитая на разделы: фотостоки, цвет, иконки и логотипы, типографика, инструменты, прототипирование, мокапы, тестирование с пользователями. Ставить ничего не нужно, только ссылки, рассортированные по назначению.

1Как я этим пользуюсь вместе с агентом

Всю страницу подряд не читаю. Открываю сразу нужные разделы — их для лендинга в первый день хватает четырёх.

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

Подключи шрифты Inter и Poppins с fonts.google.com (Inter — для текста, Poppins — для заголовков). Сделай кнопки цвета #2F6FED, это из палитры, которую я взял на coolors.co. Добавь иконки с simpleicons.org рядом с каждой карточкой возможностей.

2Бесплатно там не всё

В разделах Toolkit и Prototyping — платный софт, там и Figma, и Sketch, так что для вайб-кодера с нулевым бюджетом это не вариант. А вот разделы, которыми пользуюсь я, устроены иначе. Font Squirrel, один из пунктов в Typography, прямо пишет, что его шрифты бесплатны для коммерческого использования, и так же работают Simple Icons, BrowserFrame, Coolors и Color Hunt — без аккаунта и без оплаты.