Agent SkillsHmbown/CodeWhale › frontend-design

frontend-design

GitHub

用于创建有意设计、响应式且无障碍的UI界面,并进行视觉质量检查。强调实现细节与验收标准对齐,避免生成通用占位布局。

crates/tui/assets/skills/frontend-design/SKILL.md Hmbown/CodeWhale

Trigger Scenarios

需要构建高质量用户界面 进行UI视觉质量审查 涉及响应式或无障碍前端开发

Install

npx skills add Hmbown/CodeWhale --skill frontend-design -g -y
More Options

Non-standard path

npx skills add https://github.com/Hmbown/CodeWhale/tree/main/crates/tui/assets/skills/frontend-design -g -y

Use without installing

npx skills use Hmbown/CodeWhale@frontend-design

指定 Agent (Claude Code)

npx skills add Hmbown/CodeWhale --skill frontend-design -a claude-code -g -y

安装 repo 全部 skill

npx skills add Hmbown/CodeWhale --all -g -y

预览 repo 内 skill

npx skills add Hmbown/CodeWhale --list

SKILL.md

Frontmatter
{
    "name": "frontend-design",
    "invocation": "model+user",
    "description": "Produce intentional, responsive, accessible UI work and perform visual QA instead of generic component assembly."
}

Frontend Design

When to use

Use for UI that must feel intentional, responsive, and accessible.

Non-goals

  • Do not ship generic placeholder layouts as finished design.
  • Do not ignore accessibility.

Workflow

  1. Clarify audience and constraints.
  2. Design hierarchy, spacing, and states.
  3. Implement with responsive/accessible patterns.
  4. Visual QA against the acceptance criteria.

Version History

  • b0e4926 Current 2026-07-24 17:42

Same Skill Collection

crates/tui/assets/skills/batch/SKILL.md
crates/tui/assets/skills/best-of-n/SKILL.md
crates/tui/assets/skills/contributor-onboarding/SKILL.md
crates/tui/assets/skills/dataviz/SKILL.md
crates/tui/assets/skills/debug/SKILL.md
crates/tui/assets/skills/delegate/SKILL.md
crates/tui/assets/skills/dependency-update/SKILL.md
crates/tui/assets/skills/docx/SKILL.md
crates/tui/assets/skills/feishu/SKILL.md
crates/tui/assets/skills/fleet-manager/SKILL.md
crates/tui/assets/skills/handoff/SKILL.md
crates/tui/assets/skills/help/SKILL.md
crates/tui/assets/skills/implement/SKILL.md
crates/tui/assets/skills/interview/SKILL.md
crates/tui/assets/skills/mcp-builder/SKILL.md
crates/tui/assets/skills/mcp-discovery/SKILL.md
crates/tui/assets/skills/pdf/SKILL.md
crates/tui/assets/skills/plan/SKILL.md
crates/tui/assets/skills/plugin-creator/SKILL.md
crates/tui/assets/skills/pptx/SKILL.md
crates/tui/assets/skills/research/SKILL.md
crates/tui/assets/skills/review/SKILL.md
crates/tui/assets/skills/security-review/SKILL.md
crates/tui/assets/skills/simplify/SKILL.md
crates/tui/assets/skills/skill-creator/SKILL.md
crates/tui/assets/skills/skill-installer/SKILL.md
crates/tui/assets/skills/test/SKILL.md
crates/tui/assets/skills/v4-best-practices/SKILL.md
crates/tui/assets/skills/verify/SKILL.md
crates/tui/assets/skills/webapp-testing/SKILL.md
crates/tui/assets/skills/xlsx/SKILL.md
docs/skills/codew-release-qa-sweep/SKILL.md
docs/skills/gh-assign-issues/SKILL.md
docs/skills/gh-close-issues/SKILL.md
docs/skills/gh-compile-issues/SKILL.md
docs/skills/gh-credit-harvest/SKILL.md
docs/skills/gh-file-issue/SKILL.md
docs/skills/gh-find-prs/SKILL.md
docs/skills/gh-treasure-hunt/SKILL.md
crates/tui/assets/skills/documents/SKILL.md
crates/tui/assets/skills/presentations/SKILL.md
crates/tui/assets/skills/spreadsheets/SKILL.md

Metadata

Files
0
Version
0fe366b
Hash
949cade3
Indexed
2026-07-24 17:42

inicio - Wiki
Copyright © 2011-2026 iteam. Current version is 2.155.2. UTC+08:00, 2026-08-16 21:50
浙ICP备14020137号-1 $mapa de visitantes$