Build frontend interfaces: design system implementation, responsive layouts, animation patterns, accessibility (WCAG), and rapid prototyping with Tailwind CSS.
When to use this skill
- Building a responsive layout
- Implementing a design system
- Adding accessible interactions
Core concepts
This skill provides guidance on frontend design best practices, patterns, and common pitfalls. It is designed to be loaded on demand when a relevant task is detected.
Installation
curl -LO https://opencodeskills.dev/downloads/design/frontend-design.zip
unzip frontend-design.zip -d ~/.config/opencode/skills/Restart OpenCode — the skill loads automatically.
When it triggers
- building a responsive layout
- implementing a design system
- adding accessible interactions