Извлекайте с веб-сайтов комплексный язык дизайна, включая цвета, типографику, анимацию, интерактивные состояния, тени, градиенты, шаблоны компонентов и поведение UX. Создает точные до пикселя руководства по дизайну с адаптивными скриншотами и полной документацией по системе дизайна. Используйте при анализе дизайна веб-сайтов, создании систем дизайна или переработке сайтов.
Быстро установите AI-навык design-guide в вашу среду разработки через командную строку
Источник: tyrchen/claude-skills.
Extract the complete design language from any website with automated analysis of colors, typography, animations, interactions, and UX patterns. Goes far beyond basic CSS extraction to capture the full design system.
✅ design-guide.md - Main comprehensive guide ✅ All screenshots - Visual reference ✅ designdata.json - Structured data for programmatic use ✅ Source files - HTML, CSS, computed styles
Optional: ✅ Recreated components - If requested ✅ Comparison analysis - If analyzing multiple sites ✅ Token library - CSS/SCSS variables file
Извлекайте с веб-сайтов комплексный язык дизайна, включая цвета, типографику, анимацию, интерактивные состояния, тени, градиенты, шаблоны компонентов и поведение UX. Создает точные до пикселя руководства по дизайну с адаптивными скриншотами и полной документацией по системе дизайна. Используйте при анализе дизайна веб-сайтов, создании систем дизайна или переработке сайтов. Источник: tyrchen/claude-skills.
Стабильные поля и команды для ссылок в AI/поиске.
npx skills add https://github.com/tyrchen/claude-skills --skill design-guideИзвлекайте с веб-сайтов комплексный язык дизайна, включая цвета, типографику, анимацию, интерактивные состояния, тени, градиенты, шаблоны компонентов и поведение UX. Создает точные до пикселя руководства по дизайну с адаптивными скриншотами и полной документацией по системе дизайна. Используйте при анализе дизайна веб-сайтов, создании систем дизайна или переработке сайтов. Источник: tyrchen/claude-skills.
Откройте терминал или инструмент командной строки (Terminal, iTerm, Windows Terminal и т.д.) Скопируйте и выполните эту команду: npx skills add https://github.com/tyrchen/claude-skills --skill design-guide После установки навык будет автоматически настроен в вашей AI-среде разработки и готов к использованию в Claude Code, Cursor или OpenClaw
https://github.com/tyrchen/claude-skills