# Как убрать шаблонный AI-дизайн сайта

Чек-лист для сборки сайта, который не выглядит как ещё один шаблонный AI-лендинг: сначала вкус и система, потом генерация.

## Сервисы из ролика

| Что | Зачем | Ссылка / команда |
| --- | --- | --- |
| **Realtime Colors** | Собрать палитру и шрифты, сразу увидеть их на реальном макете. | https://www.realtimecolors.com/ |
| **TweakCN** | Подобрать тему для shadcn/ui и экспортировать CSS-переменные. | https://tweakcn.com/ |
| **Haikei** | Сделать фоновые SVG/PNG-формы без банального градиента. | https://haikei.app/ |
| **Motion Primitives** | Добавить готовые анимации и микровзаимодействия. | https://motion-primitives.com/docs |

## Порядок работы

- [ ] Найди 3-5 референсов конкретного типа сайта, а не просто “красивый SaaS”.
- [ ] Выпиши, что именно берёшь: сетку, плотность, навигацию, тип кнопок, карточки, тон иллюстраций.
- [ ] Собери цвета и шрифты в Realtime Colors и экспортируй переменные.
- [ ] Подбери тему компонентов в TweakCN, чтобы кнопки, карточки и поля не выглядели дефолтно.
- [ ] Сгенерируй фон в Haikei только если он помогает композиции, а не просто украшает пустоту.
- [ ] Возьми 1-2 анимации из Motion Primitives: меню, появление блоков, текстовый эффект или интерактивную карточку.
- [ ] Передай агенту не “сделай красиво”, а готовый дизайн-бриф с запретами.

## Промпт для агента

```
Собери страницу по этим правилам:
1. Не используй фиолетово-синий градиент, Inter по умолчанию, три одинаковые карточки и generic SaaS hero.
2. Используй палитру и шрифты из CSS-переменных ниже: [ВСТАВЬ ПЕРЕМЕННЫЕ].
3. Ориентируйся на эти референсы: [ССЫЛКИ / ОПИСАНИЕ].
4. Компоненты делай в стиле: [TweakCN theme / описание].
5. Добавь только 1-2 осмысленные анимации: [что именно].
6. В финале покажи, где в коде заданы дизайн-токены и какие дефолты ты сознательно не использовал.
```

---

Источник: https://localhost:3000/m/kak-ubrat-shablonnyy-ai-dizayn-sayta