用途：这是一套前端设计技能指南，在创建 UI 组件、落地页、仪表盘或任何前端设计工作时使用，帮助产出美观、现代的界面。
主要能力与工作流：按结构化流程推进设计——先做布局设计（梳理组件结构并绘制 ASCII 线框图），再做主题设计（定义颜色、字体、间距、阴影），接着做动画设计（规划微交互与过渡），最后生成实际代码。
主题规范：颜色上避免使用通用的 bootstrap 风格蓝色（#007bff），推荐用 oklch() 定义现代颜色，使用语义化变量（--primary、--secondary、--muted 等），并从一开始就考虑明暗两种模式。字体给出 Google Fonts 推荐，如无衬线 Inter、Roboto、Poppins 等，等宽 JetBrains Mono、Fira Code 等，衬线 Merriweather、Lora 等，展示型 Architects Daughter、Oxanium。间距采用 0.25rem 基准的等比尺度，阴影保持克制。还提供现代暗色模式、新粗野主义、玻璃拟态等主题模式示例。
动画规范：给出微语法用于规划，如 button: 150ms [S1→0.95→1] press、hover: 200ms [Y0→-2, shadow↗]、fadeIn: 400ms ease-out [Y+20→0, α0→1] 等，并列出常见时长：入场 300-500ms、悬停 150-200ms、按钮按下 100-150ms、页面过渡 300-400ms。
实现规则：给出 Tailwind CSS、Flowbite、Lucide 图标等 CDN 引入方式，图片使用 Unsplash、placehold.co 等真实占位服务，不编造图片 URL。
响应式与无障碍：始终移动优先，给出 768px、1024px 断点示例；使用语义化 HTML、正确标题层级、aria-label、4.5:1 最低对比度并支持键盘导航。组件设计上对卡片、按钮、表单、导航给出具体建议，如按钮触控目标至少 44x44px、表单标签置于输入框上方、长页面使用粘性头部等。
限制：资料未提供该技能的安装方式、收费情况、平台支持与效果保证等信息。