Анализирует стили проекта и пишет подробный гайд: цвета, шрифты, отступы, компоненты, тени, анимации, радиусы и Tailwind.
Замените фрагменты в квадратных скобках своими данными и вставьте промпт в чат с ИИ.
Значения сразу появятся в превью, коде и при копировании.
Ты — автор стайлгайдов. Проанализируй систему стилей проекта и составь подробный STYLE_GUIDE.md, не упуская важных деталей. Проект: [название и назначение] Код стилей: [вставь tailwind.config, глобальные CSS и 3–5 типичных компонентов или укажи путь] Разделы: 1. Обзор: общий характер интерфейса и ключевые принципы. 2. Цветовая палитра: все цвета с hex, роль и где используются, светлая и тёмная тема. 3. Типографика: шрифты, шкала размеров, веса, межстрочный интервал, где что применяется. 4. Система отступов: шкала и правила применения. 5. Стили компонентов: кнопки, поля, карточки, навигация, модалки — варианты и состояния. 6. Тени и elevation: уровни и когда какой. 7. Анимации и переходы: длительности, easing, что анимируется. 8. Радиусы скругления. 9. Прозрачность: используемые значения и зачем. 10. Типичное использование Tailwind: частые комбинации классов, кастомные утилиты. В конце добавь пример эталонного компонента (например карточки) в стиле проекта, который показывает все правила вместе. Формат: Markdown с таблицами для значений и блоками кода для примеров. Описывай то, что реально есть в коде; расхождения вынеси в отдельный список в конце.
```text Ты — автор стайлгайдов. Проанализируй систему стилей проекта и составь подробный STYLE_GUIDE.md, не упуская важных деталей. Проект: [название и назначение] Код стилей: [вставь tailwind.config, глобальные CSS и 3–5 типичных компонентов или укажи путь] Разделы: 1. Обзор: общий характер интерфейса и ключевые принципы. 2. Цветовая палитра: все цвета с hex, роль и где используются, светлая и тёмная тема. 3. Типографика: шрифты, шкала размеров, веса, межстрочный интервал, где что применяется. 4. Система отступов: шкала и правила применения. 5. Стили компонентов: кнопки, поля, карточки, навигация, модалки — варианты и состояния. 6. Тени и elevation: уровни и когда какой. 7. Анимации и переходы: длительности, easing, что анимируется. 8. Радиусы скругления. 9. Прозрачность: используемые значения и зачем. 10. Типичное использование Tailwind: частые комбинации классов, кастомные утилиты. В конце добавь пример эталонного компонента (например карточки) в стиле проекта, который показывает все правила вместе. Формат: Markdown с таблицами для значений и блоками кода для примеров. Описывай то, что реально есть в коде; расхождения вынеси в отдельный список в конце. ```
{
"messages": [
{
"role": "user",
"content": "Ты — автор стайлгайдов. Проанализируй систему стилей проекта и составь подробный STYLE_GUIDE.md, не упуская важных деталей.\n\nПроект: [название и назначение]\nКод стилей: [вставь tailwind.config, глобальные CSS и 3–5 типичных компонентов или укажи путь]\n\nРазделы:\n1. Обзор: общий характер интерфейса и ключевые принципы.\n2. Цветовая палитра: все цвета с hex, роль и где используются, светлая и тёмная тема.\n3. Типографика: шрифты, шкала размеров, веса, межстрочный интервал, где что применяется.\n4. Система отступов: шкала и правила применения.\n5. Стили компонентов: кнопки, поля, карточки, навигация, модалки — варианты и состояния.\n6. Тени и elevation: уровни и когда какой.\n7. Анимации и переходы: длительности, easing, что анимируется.\n8. Радиусы скругления.\n9. Прозрачность: используемые значения и зачем.\n10. Типичное использование Tailwind: частые комбинации классов, кастомные утилиты.\n\nВ конце добавь пример эталонного компонента (например карточки) в стиле проекта, который показывает все правила вместе.\n\nФормат: Markdown с таблицами для значений и блоками кода для примеров. Описывай то, что реально есть в коде; расхождения вынеси в отдельный список в конце."
}
]
}