Welcome to Framecheck
Test your Storybook, understand every change, and ship with confidence.
Framecheck compares your component stories with images your team has approved. Connect your repository, upload a build from CI, and review visual changes alongside your pull request. You can also check accessibility and track new issues over time.
Get your first result#
- Set up your project and connect GitHub.
- Add Framecheck to CI and upload your Storybook.
- Review your first run and establish an accepted baseline.
Find your workflow#
| I want to… | Start here |
|---|---|
| Connect an existing Storybook | Quickstart |
| Test mobile layouts and themes | Viewports and modes |
| Understand a failing pull request | Policies and GitHub checks |
| Reduce noisy visual changes | Stable stories |
| Test React Native components | React Native overview |
| Add accessibility checks | Accessibility |
| Invite a designer or teammate | Teams and roles |
| Fix a build that will not upload | Troubleshooting |
What Framecheck tests#
A story is an isolated example of a component in a particular state: an empty form, a loading button, or a populated table. A visual snapshot is one story at one viewport in one browser. Modes can add more variants, such as light and dark themes.
Framecheck tests your built Storybook. It does not crawl your production website. Stories need to render with the files and mock data included in the uploaded build.
Availability#
Framecheck is in beta. Guides labelled Preview cover upcoming workflows, including native Android and iOS capture. They explain how to prepare, but do not mean those features are enabled for every account. See feature availability before configuring preview features.
Need help?#
Contact support with your run link and what you expected to happen. Do not include upload tokens, passwords, or customer data. For service incidents, check system status.