design-system-conventions
OfficialEnforce semantic design tokens for consistent UI.
Design & Creative#typography#frontend#design-system#style-guide#color-tokens#semantic-tokens#ui-styling
AuthorEsdeveniments
Version1.0.0
Installs0
System Documentation
What problem does it solve?
This Skill guides teams to replace ad-hoc color utilities and non-semantic classes with semantic design tokens, ensuring consistent visuals and reduced technical debt.
Core Features & Use Cases
- Enforces semantic tokens for color, typography, spacing, and borders across UI components.
- Provides migration guidance and examples to replace gray-* utilities with design tokens.
- Supports teams in maintaining a cohesive design language across apps and features.
Quick Start
Start by auditing your styles to identify non-semantic color utilities and non-tokenized typography, then replace them with tokens and semantic classes as per the guidelines.
Dependency Matrix
Required Modules
None requiredComponents
Standard package💻 Claude Code Installation
Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.
Please help me install this Skill: Name: design-system-conventions Download link: https://github.com/Esdeveniments/esdeveniments-frontend/archive/main.zip#design-system-conventions Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
Agent Skills Search Helper
Install a tiny helper to your Agent, search and equip skill from 223,000+ vetted skills library on demand.