/frontend-design
Design and build production-grade frontends with bold, distinctive aesthetics.
$ npx -y skills add CoWork-OS/CoWork-OS --skill frontend-design --agent claude-codeHow it fires
How this skill gets triggered: by you, by Claude, or both.
- Fires itselfAuto-invocation. Claude auto-loads it when your prompt matches the work.Auto-invocation is when the right skill fires by itself at the right moment, driven by a FLOW.md router and a hook, instead of you invoking it by name. It is the difference between a skill being installed and a skill actually getting used.Read the full definition →
- You can call itInvoke it directly when you want it.
- Slash command
/frontend-design
Context preview
The summary Claude sees to decide when to auto-load this skill.
Design and build production-grade frontends with bold, distinctive aesthetics.
SKILL.md
frontend-design.SKILL.mdname: frontend-design
description: "Design and build production-grade frontends with bold, distinctive aesthetics."
frontend-design
Purpose
Design and build production-grade frontends with bold, distinctive aesthetics.
Routing
- Use when: Use when the user asks to design and build production-grade frontends with bold, distinctive aesthetics.
- Do not use when: Do not use when the request is asking for planning documents, high-level strategy, or non-executable discussion; use the relevant planning or design workflow instead.
- Outputs: Outcome from frontend-design: task-specific result plus concrete action notes.
- Success criteria: Returns concrete actions and decisions matching the requested task, with no fabricated tool-side behavior.
Trigger Examples
Positive
- Use the frontend-design skill for this request.
- Help me with frontend-design.
- Use when the user asks to design and build production-grade frontends with bold, distinctive aesthetics.
- frontend-design: provide an actionable result.
Negative
- Do not use when the request is asking for planning documents, high-level strategy, or non-executable discussion; use the relevant planning or design workflow instead.
- Do not use frontend-design for unrelated requests.
- This request is outside frontend-design scope.
- This is conceptual discussion only; no tool workflow is needed.
Runtime Prompt
- Current runtime prompt length: 4071 characters.
- Runtime prompt is defined directly in `../frontend-design.json`.
Read more
name: frontend-design description: "Design and build production-grade frontends with bold, distinctive aesthetics."
frontend-design
Purpose
Design and build production-grade frontends with bold, distinctive aesthetics.
Routing
- Use when: Use when the user asks to design and build production-grade frontends with bold, distinctive aesthetics.
- Do not use when: Do not use when the request is asking for planning documents, high-level strategy, or non-executable discussion; use the relevant planning or design workflow instead.
- Outputs: Outcome from frontend-design: task-specific result plus concrete action notes.
- Success criteria: Returns concrete actions and decisions matching the requested task, with no fabricated tool-side behavior.
Trigger Examples
Positive
- Use the frontend-design skill for this request.
- Help me with frontend-design.
- Use when the user asks to design and build production-grade frontends with bold, distinctive aesthetics.
- frontend-design: provide an actionable result.
Negative
- Do not use when the request is asking for planning documents, high-level strategy, or non-executable discussion; use the relevant planning or design workflow instead.
- Do not use frontend-design for unrelated requests.
- This request is outside frontend-design scope.
- This is conceptual discussion only; no tool workflow is needed.
Runtime Prompt
- Current runtime prompt length: 4071 characters.
- Runtime prompt is defined directly in `../frontend-design.json`.
Local-first personal agentic OS and everything app for coding, knowledge work, web design, automations, and artifacts.
Repo: CoWork-OS/CoWork-OS
Other skills on cowork-os.
- /attack-path-analysis
Use when Codex is already in the attack-path-analysis phase of a security scan or the user explicitly asks to trace a security finding from source to sink and calibrate severity. Do not use as the primary trigger for full PR, commit, branch, patch, or repository scans.
Open skill - /deep-security-scan
Use when the user asks for a deep, exhaustive, multi-pass, or variance-reducing repository-wide Codex Security scan. Run repeated independent repository-wide discovery passes with worker-specific threat models, semantically merge candidates, synthesize one canonical validation
Open skill - /finding-discovery
Use when Codex is already in the finding-discovery phase of a security scan or the user explicitly asks to discover candidate security findings in a repository or code change. Do not use as the primary trigger for full PR, commit, branch, patch, or repository scans.
Open skill - /fix-finding
Use when the user explicitly asks to fix and verify a validated or plausible security finding. Do not use as the primary trigger for full PR, commit, branch, patch, or repository scans.
Open skill - /security-diff-scan
Use when the user asks for a security review of a pull request, commit, branch diff, working-tree patch, or other Git-backed change set.
Open skill - /security-scan
Use when the user asks for a repository-wide or scoped-path security scan.
Open skill