# Как забрать у нейросети дефолтный дизайн

Модель не выбирает вкус — она выдаёт среднее по обучающей выборке. Единственный способ получить другой результат: принести ей источник до того, как она начнёт угадывать.

врезка `// Три приметы, по которым сайт узнают за секунду`: текст «Фиолетово-синий градиент в шапке · шрифт Inter по умолчанию · три одинаковые карточки в ряд под первым экраном. Если совпало хотя бы два — дальше по шагам.»

## 1. Палитра и шрифты

Realtime Colors — БЕСПЛАТНО
Подбираешь цвета и шрифты сразу на живом макете сайта, а не на квадратиках. Есть контраст-чекер и экспорт готовыми переменными.
realtimecolors.com · шрифты: fonts.google.com

- [ ] Выбрал 4 цвета: текст, фон, основной, акцент. Основной — не индиго и не фиолетовый.
- [ ] Проверил контраст текста к фону: минимум AA, лучше AAA.
- [ ] Поставил пару шрифтов: один для заголовков, один для текста. Inter и Arial — мимо.
- [ ] Выгрузил результат в CSS-переменные или Tailwind-конфиг и сохранил отдельным файлом.

## 2. Тема компонентов

tweakcn — ОТКРЫТЫЙ КОД · APACHE-2.0
Визуальный редактор темы для shadcn/ui. Существует ровно потому, что сайты на дефолтной теме выглядят одинаково. Пресеты, правка каждого токена, экспорт в CSS-переменные и Figma. Регистрация не нужна.
tweakcn.com/editor/theme · исходники: github.com/jnsahaj/tweakcn

- [ ] Взял пресет как отправную точку, а не дефолт из коробки.
- [ ] Подставил свои цвета из шага 1: primary, secondary, accent, border, ring.
- [ ] Проверил тему в тёмном режиме — не только в светлом.
- [ ] Скопировал блок CSS-переменных к себе в проект.

## 3. Фон

Haikei — БЕСПЛАТНО · БЕЗ РЕГИСТРАЦИИ
Около 15 генераторов SVG-фонов: волны, блобы, размытые градиенты, лоу-поли сетки, россыпь кругов. Экспорт в SVG и PNG, всё считается прямо в браузере.
haikei.app · список генераторов: haikei.app/generators

- [ ] Собрал фон в цветах из шага 1, а не в дефолтной палитре генератора.
- [ ] Скачал SVG, а не PNG — он масштабируется и весит меньше.
- [ ] Проверил, что текст поверх фона читается на телефоне.

## 4. Анимации

Motion Primitives — ОТКРЫТЫЙ КОД · MIT
Набор готовых анимированных React-компонентов на Motion и Tailwind: появление текста, реакция на скролл, подсветка за курсором, док в стиле macOS. Копируешь блок кода, а не описываешь анимацию словами.
github.com/ibelick/motion-primitives

- [ ] Выбрал 2-3 эффекта максимум. Больше — это уже не дизайн, это ярмарка.
- [ ] Скопировал код компонентов в проект до того, как просить модель что-то верстать.
- [ ] Проверил, что анимации не мешают читать на слабом телефоне.

## 5. Что отдать модели

Не просьба «сделай красиво», а ограничения. Вставляй блок в начало задачи — и дальше модель собирает по нему, а не по среднему из интернета.

```
Работай строго внутри этих ограничений.

ЦВЕТА: используй только переменные из моего файла темы.
Индиго, фиолетовый и сине-фиолетовые градиенты запрещены.

ШРИФТЫ: заголовки - [шрифт 1], текст - [шрифт 2].
Inter, Roboto и Arial не использовать.

ФОН: подключи мой SVG из /assets. Свой градиент не генерируй.

КОМПОНЕНТЫ: бери готовые блоки из моей папки components.
Новые анимации не придумывай.

СТРУКТУРА ПЕРВОГО ЭКРАНА: не три одинаковые карточки в ряд.
Предложи два других варианта раскладки и объясни выбор.
```

## 6. Проверка перед публикацией

- [ ] В коде не осталось индиго и фиолетовых градиентов.
- [ ] Шрифт — твой, а не дефолтный.
- [ ] Первый экран не собран из трёх одинаковых карточек.
- [ ] Контраст текста проходит AA на всех блоках.
- [ ] Фон — файл из твоей папки, а не сгенерированный на ходу.
- [ ] Открыл на телефоне и на широком мониторе.

врезка `// Последний тест`: текст «Открой свой первый экран рядом с тремя чужими лендингами и спроси человека, который не в теме, какой из четырёх собрала нейросеть. Если он не угадывает — готово.»

Всё в списке бесплатное. Порядок шагов важнее набора инструментов.

---

Источник: https://localhost:3000/m/plohoy-disign-ai