用途：提供生产级界面的 CSS 实现模式，聚焦代码层面；设计基础与决策参见 ui-design，创意美学参见 frontend-design。
安装：npx clawhub@latest install web-design
主要能力：布局上二维用 CSS Grid、一维用 Flexbox，含页面结构、导航、卡片网格、居中、侧栏加内容、网格叠放等场景；排版给出字体搭配方向与 1.25 比例字阶，正文 1rem、行高 1.5、行长 60–75ch；配色定义主色、中性色、强调色、语义色、表面色五种角色，用 HSL/OKLCH 与表面分层营造深度，要求 WCAG 对比度 4.5:1（正文）与 3:1（大字）；间距采用 8px 基准的 token 体系，容器用 gap 替代子元素 margin；响应式给出 640/1024/1440px 断点策略，并用 clamp()、auto-fit 网格与容器查询实现流式布局；无障碍涵盖对比度、键盘导航、:focus-visible、语义 HTML、alt 文本、prefers-reduced-motion、44×44px 触控目标与必要 ARIA；组件部分列出默认、悬停、按下、聚焦、禁用、加载状态，以及三层设计 token 架构；动效给出时长与缓动建议，并可用 animation-timeline: scroll() 实现滚动驱动效果。
适用场景：需要落地 CSS 的界面开发与设计系统搭建。
限制：资料未提供具体收费、价格、平台支持范围与效果数据。