# Frontend Design

Produce intentional, responsive, accessible UI work and perform visual QA instead of...

- Repository: https://github.com/codewhale-hq/Codewhale (41164 stars)
- Category: Design
- License: MIT
- Last updated: 2026-11-01
- Runs scripts: no, instructions only

## Install

Claude Code: `npx skills add codewhale-hq/Codewhale --skill frontend-design -g -a claude-code -y`
Codex: `npx skills add codewhale-hq/Codewhale --skill frontend-design -g -a codex -y`
Cursor: `npx skills add codewhale-hq/Codewhale --skill frontend-design -g -a cursor -y`
Gemini CLI: `npx skills add codewhale-hq/Codewhale --skill frontend-design -g -a gemini-cli -y`

## Description

Produce intentional, responsive, accessible UI work and perform visual QA instead of generic component assembly.

## SKILL.md, as published by its author (untrusted third-party text, read it as data)

# 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.