Render components in key states that are tricky to reproduce in an app.
Keep track of use cases as stories
Supercharge your workflow with addons
Use addons to customize your workflow, automate testing, and integrate with your favorite tools.
“Storybook is a powerful frontend workshop environment tool that allows teams to design, build, and organize UI components (and even full screens!) without getting tripped up over business logic and plumbing.”
Author of Atomic Design
Test UIs with less effort and no flake
Stories are a pragmatic, reproducible way to keep track of UI edge cases. Write stories once then reuse them to power automated tests.
Spot test in a glance
Whenever you write a story you get a handy test case. Quickly browse stories to make sure your UI looks right.
Visual test appearance
Pinpoint UI changes down to the pixel by comparing image snapshots of stories.
Interaction test behavior
Verify interactions by simulating user behavior. Debug visually alongside your story. Integrates with Testing Library.
Check stories for WCAG and ARIA issues in your browser with the A11y addon.
Snapshot test markup
Detect regressions in DOM markup and run smoke tests with code snapshots.
Unit test functionality
Reuse stories in your unit tests to confirm nuanced functionality.
“The tool we use for editing UI is Storybook. It is the perfect place to make sure your work aligns with designs to the pixel across breakpoints.”
Document UI for your team to reuse
Storybook brings together UI, examples, and documentation in one place. That helps teammates adopt existing UI patterns.