用途：面向 Kilo Code 前端的设计指导技能，适用于外观、行为、文案与适配相关任务。核心原则是设计契约优先：根目录 DESIGN.md 是代币名称、取值、领域映射、字体角色、圆角与间距的唯一事实来源，reference/kilo-brand.md 说明如何应用该契约；若指南、现有 CSS 或组件与 DESIGN.md 冲突，视为实现漂移而非先例。每次调用都应先加载 DESIGN.md 与 reference/kilo-brand.md。两者定义深色优先主题与六层表面阶梯、品牌黄绿主色（每屏仅用作主 CTA 一次）、状态域与语法、diff 配色、Inter/Roboto Mono 字体角色（JetBrains Mono 仅限编辑器）、间距圆角组件与动效约定，以及需拒绝的反模式。
使用方式：先判断语境（产品界面或品牌营销，不明确则按产品界面），再按提示词加载对应参考文档：排版、颜色与对比、空间、动效、交互、响应式、UX 写作，审查或整体改版则全加载。涉及具体文件时应先读取现有代码，不要猜测。实现请求产出代码，审查请求产出带文件路径与行号、具体代币/工具类建议及理由的报告。
实现要点：优先使用映射语义代币的 Tailwind 工具类而非十六进制值；在现有 ui/ 原语中扩展 cva 变体；图标用 lucide-react，仅图标按钮加 aria-label；浮层用 Radix + shadcn 封装；控件高度、顶栏与卡片间距保持紧凑节奏。审查时按 Blocker/Improvement/Nit 分级，并明确指出响应式、减弱动效、键盘与读屏缺口。
限制与移动端：不自动扫描反模式，不提供实时模式，不生成或重定义 DESIGN.md，也不批量迁移遗留蓝色 CTA（应另开设计系统 PR）。移动端用 React Native + NativeWind，CSS 变量主题色不能与 NativeWind 透明度修饰符组合，safe-area 需用 RN 工具，且不适用 hover，应设计 pressed 状态。资料未提供具体版本、收费与安装命令。