storybook
CommunityVisual UI component docs via CSF3 stories.
Software Engineering#documentation#a11y#storybook#csf3#component-docs#visual-showcase#portable-stories
AuthorHigashi-Kota
Version1.0.0
Installs0
System Documentation
What problem does it solve?
This Skill standardizes UI component documentation by using CSF3-style storytelling to replace sprawling prop-focused stories with concise, visually-driven catalogs.
Core Features & Use Cases
- CSF3 showcase: one story displays multiple variants in a grid for quick visual comparison.
- State matrices & real-world use cases: demonstrates component states and practical usage in realistic layouts.
- A11y and portable stories: includes accessibility checks and portable-story patterns for cross-project reuse.
Quick Start
Install Storybook in your project, define a CSF3 showcase story following the patterns in this skill, and run the docs server to view the visual catalog.
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: storybook Download link: https://github.com/Higashi-Kota/llm-mermaid-chat/archive/main.zip#storybook 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.