frontend-design-system
Note: This skill is a platform-specific variant of
design-system. Preferdesign-systemfor general use; usefrontend-design-systemwhen targeting platform-specific configurations.
Frontend Design System
A skill for production-grade UI design. Supports consistent, scalable frontend development through clear design tokens, layout rules, motion guidelines, and accessibility checks.
When to use this skill
- Production-quality UI needed: Generate high-quality UI from prompts
- Consistent design language: Maintain a unified visual language across screens
- Typography/layout/motion guidance: Systematic design system
Instructions
Step 1: Define Design Tokens
More from akillness/skills-template
backend-testing
>
71data-analysis
>
54plannotator
>
35task-planning
Plan and organize software development tasks effectively. Use when breaking down features, creating user stories, or planning sprints. Handles task breakdown, user stories, acceptance criteria, and backlog management.
35omc
Use when you need Teams-first multi-agent orchestration in Claude Code. Triggers on: omc, autopilot, ralph, ulw, ccg, team. 29+ specialized agents, smart model routing (Haiku→Opus), persistent execution loops, skill layers, real-time HUD.
33vibe-kanban
Manage AI coding agents on a visual Kanban board. Run parallel agents through a To Do→In Progress→Review→Done flow with automatic git worktree isolation and GitHub PR creation.
32