frontend-design-md
CommunityApply design systems, ship cinematic UI, generate visual assets.
Design & Creative#data visualization#design systems#parallax#svg generation#ui consistency#cinematic scroll
AuthorCozythecoder
Version1.0.0
Installs0
System Documentation
What problem does it solve?
This skill removes guesswork in UI consistency by turning design system knowledge and cinematic frontend patterns into actionable guidance and generation steps.
Core Features & Use Cases
- Design system intelligence: Detects project type, extracts tokens, recommends a matching design system, and helps apply it with validation gates.
- Cinematic “epic design” workflows: Guides scroll-driven 2.5D/parallax layout construction with quality rules and motion structure.
- Visualization + SVG creation: Generates charts/tables from data and creates icons/logos as optimized SVG outputs.
Quick Start
Use the frontend-design-md skill to analyze your project and recommend the best-matching design system by running: /design analyze for my repository.
Dependency Matrix
Required Modules
None requiredComponents
references
💻 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: frontend-design-md Download link: https://github.com/Cozythecoder/frontend-design-md/archive/main.zip#frontend-design-md 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 471,000+ vetted skills library on demand.