FTShare-Lab Frontend Design 前端设计技能
本技能指导 AI 智能体输出具备专业设计师水准的高质量前端代码。
设计原则
- 语义化 Token：一律使用设计系统的语义颜色 token（如
background,foreground,card,primary,muted等），禁止硬编码乱用 Hex / RGB 颜色。 - 严谨的字阶与对齐：使用清晰的字号梯队（如
text-xs,text-sm,text-base,text-lg等），确保行高与侧栏/基准线对齐。 - 呼吸感与层次：合理运用负空间（Padding/Margin）、圆角半径（Radius）与柔和阴影，避免界面杂乱拥挤。
- 组件交互细节：按钮与卡片必须包含自然的 Hover/Active 状态、Focus Ring 聚焦环和可访问性标签（ARIA）。