Топ ИИ-сервисов для дизайна ваших сайтов: бесплатно Вдогонку к предыдущему посту — вообще, сам ролик (и сайты, которые в нем упомянуты) собрал для меня агент, но вам так зашло, что я попросил Клод отдельно выписать для вас сами ресурсы, сохраняем:
Дизайн-система styles.refero.design — больше двух тысяч разборов стиля реальных сайтов с цветами, шрифтами, отступами и готовым файлом DESIGN.md, который скармливаешь нейронке. Смотреть и копировать можно без регистрации.
ui.shadcn.com — бесплатные компоненты с открытым кодом. Это основа, из которой собираешь свою систему, и её можно тащить в коммерческий проект.
Свои цвета tweakcn.com — редактор тем для shadcn с ползунками для цвета, скруглений, отступов и теней. Крутишь, пока не понравится, и забираешь готовую тему. Работает без регистрации. Через ИИ бесплатно можно сделать пять тем, дальше нужен Pro за $8 в месяц.
Референсы mobbin.com — скриншоты реальных приложений и сайтов. Бесплатно открыта только часть, а полный доступ стоит от $10 в месяц при оплате за год.
Для сайтов есть бесплатная замена, lapa.ninja. Там больше семи тысяч лендингов, и все открыты.
Шрифты с кириллицей fonts.google.com — все шрифты бесплатные, их можно ставить на коммерческий сайт и даже в логотип. Кириллица есть у 294 семейств: включи фильтр по языку, и останутся только они. Для старта попробуй Manrope, Onest, Golos Text, Inter и Unbounded.
Иконки iconify.design — больше 300 тысяч иконок в 222 наборах, и лицензия у каждого своя, так что глянь её, прежде чем ставить.
solar-icons.vercel.app — иконки Solar в шести стилях. В коммерции можно, но автора (480 Design) нужно указать.
3dicons.co — объёмные иконки под лицензией CC0, ставишь куда угодно, даже не указывая автора.
Готовые блоки 21st.dev — больше 12 тысяч компонентов, и к каждому приложен промпт для нейронки. Бесплатно можно забрать два в день, дальше подписка от $6 в месяц при оплате за год.
Если лимит душит, бери ui.shadcn.com/blocks и magicui.design, оба бесплатные и с открытым кодом.
Витрина, ради которой стоило досмотреть ролик от агента: storybook.js.org — бесплатная витрина, где цвета, шрифты и экраны проекта собираются в одном месте. На storybook.js.org/ai лежит готовый промпт, по которому агент сам ставит Storybook и собирает туда компоненты. ИИ-функции у них пока в тестовом режиме, а MCP-сервер работает только с React.
Я бы шёл так. Берёшь стиль в Refero, красишь тему в tweakcn, ставишь шрифт с кириллицей из Google Fonts, докидываешь иконки и блоки, а в конце просишь агента собрать всё в Storybook. Тогда видишь внешку целиком, а не кусками по экранам.
Сохрани пост, пригодится на следующем проекте. Вот так агент и ролик делает, и собирает для нас полезные подборки. Кайф же!
