Skip to main content

frontend-design

高品质前端界面与 UI 设计规范技能。当用户要求设计组件、优化页面视觉风格、规范布局与配色时激活。

Zur Installation springen

Quellinformationen

Repository
FTShare-Lab/ftai-desktop-plugins-official
Letzte Quellaktivität
24. August 2026 um 02:16
Erkannte Sprache von SKILL.md
Chinesisch
Sterne
0
Forks
0

Installationsoptionen

Standardmäßig ist der Prompt ausgewählt, der zuerst die Quelle prüft. Sie können zu einem direkten Befehl wechseln oder eine lokale Kopie herunterladen.

Quelldateien prüfen

Lesen Sie SKILL.md und alle von SkillsMP angezeigten Begleitdateien, bevor Sie sich für eine Installation entscheiden.

SKILL.md wird angezeigt

SKILL.md
Quellanweisungen · Schreibgeschützte Vorschau
name
frontend-design
description
高品质前端界面与 UI 设计规范技能。当用户要求设计组件、优化页面视觉风格、规范布局与配色时激活。
# Frontend Design 前端设计技能 本技能指导 AI 智能体输出具备专业设计师水准的高质量前端代码。 ## 设计原则 1. **语义化 Token**:一律使用设计系统的语义颜色 token(如 `background`, `foreground`, `card`, `primary`, `muted` 等),禁止硬编码乱用 Hex / RGB 颜色。 2. **严谨的字阶与对齐**:使用清晰的字号梯队(如 `text-xs`, `text-sm`, `text-base`, `text-lg` 等),确保行高与侧栏/基准线对齐。 3. **呼吸感与层次**:合理运用负空间(Padding/Margin)、圆角半径(Radius)与柔和阴影,避免界面杂乱拥挤。 4. **组件交互细节**:按钮与卡片必须包含自然的 Hover/Active 状态、Focus Ring 聚焦环和可访问性标签(ARIA)。
Auf GitHub ansehen