Implement brand systems: define and apply color palettes, typography scales, spacing systems, and component variants that maintain visual consistency across a product.
When to use this skill
- Implementing a color system
- Creating a typography scale
- Building a brand-consistent component
Core concepts
This skill provides guidance on brand system 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/brand-system.zip
unzip brand-system.zip -d ~/.config/opencode/skills/Restart OpenCode — the skill loads automatically.
When it triggers
- implementing a color system
- creating a typography scale
- building a brand-consistent component