Starter trial
Try it on your own project
£0for 30 days
- £25 of usage for 30 days (about 50,000 web snapshots)
- No card required
- One GitHub project. £84 fee waived for the trial.
Visual regression testing for Storybook and GitHub Catch unexpected UI changes before you merge.
Framecheck screenshots your Storybook components and compares them with the version your team approved, so you can spot broken layouts and review intended changes on GitHub.
30 days of Starter. £25 of usage (about 50,000 web snapshots). One project. No card required.
A “story” is an isolated component example in Storybook. What do I need?
Checkout/CardPaymentRejectAccept
Needs review 3PaymentHoverLoadingDisabled
Side by sideDiffOverlay
Previously approved
Your order
New version
Your order
An intended colour change is ready to accept. The broken spacing needs a fix in your code.
Try reviewing a sample change →No account needed. Changes affect only your demo.
How it works
Three steps from your first sign-in to Framecheck on every pull request.
Create your account
Sign up with your email, then install the Framecheck GitHub App on your Storybook repository.
Add Framecheck to CI
Framecheck opens a setup pull request that adds one GitHub Actions workflow. Copy the project’s upload token and add it once as a repository secret.
Review changes on pull requests
Your first pull request captures every story; accept it, and merging it sets your baseline: the reference screenshots for future reviews. On later pull requests, accept intentional changes or fix unexpected ones.
What you get
See what changed
Compare the previously approved screenshot with the new version, side by side, as a highlighted diff or as an overlay. Review individual changes or accept the changes you have filtered.
- Side by side
- Diff
- Overlay
Find accessibility issues
Optional axe-core checks flag common accessibility problems alongside your screenshots. Review new findings separately. Automated checks do not establish compliance.
Keep feedback on GitHub
Framecheck on each pull request links to the review. Choose whether changes need approval, fail the pull request, or just report what changed.
The result lands where you review code
Framecheck reports on the pull request itself. Reviewers follow Framecheck's result to the review screen, and it updates when changes are accepted or rejected.
- Visual changes and accessibility findings are reviewed separately
- Approvals apply to the exact images a reviewer saw
- Accepting on a pull request never changes the baseline
Checks on pull request #412build-storybook — SuccessfulFramecheck — 3 awaiting reviewChanged 2 · Added 1 · Unchanged 212Accessibility: no new issues
Built for your existing Storybook
Check your setup
You need a static Storybook (8.6 or later), a GitHub repository and CI that can build it. Each story should render with predictable fixtures, fonts and external services.
Your code and data
- What we receive
- Your built Storybook from CI: compiled code and assets, plus any source maps you include. Commit details, not a checkout of your repository.
- What we read on GitHub
- Only repositories you choose: the file list, pull request details and a few config files (package.json, workflows, .npmrc, Node version files, .storybook/main) to set up CI. Never other file contents.
- What we write
- One Framecheck result on each pull request commit, linked to the run, and a comment on pull requests with visual changes or failures (you can turn comments off). Write access to code and workflows is used only to open the one-file setup pull request, on its own branch.
- Where it’s stored
- AWS in London (eu-west-2).
- How long
- Uploaded builds: 30 days. Screenshots and run history: while the project exists.
Simple pricing
A snapshot is one component example checked at one screen size in one browser. Optional accessibility checks also use your plan credit. Compare plans for a worked example and cost estimator.
Starter
For teams getting visual checks into their workflow
£84a month
- £25 of usage included each billing period (about 50,000 web snapshots)
- Then 50p per 1,000 snapshots
- Priority over trial runs
Pro
For higher usage and a closer support channel
£149a month
- £50 of usage included each billing period (about 110,000 web snapshots)
- Then 45p per 1,000 snapshots
- Priority over trial runs
- Dedicated Slack channel; best-effort support
Your trial starts when you connect your first eligible GitHub project. No automatic subscription. Choose a paid plan after 30 days. Trial eligibility and credit details
Compare plans and estimate costs
Need a different allowance or volume rate?
Talk to us about a custom monthly plan.
Questions
What is Framecheck?
Framecheck is a hosted visual regression testing service for Storybook. It captures screenshots of your stories in Chromium, Firefox and WebKit, compares them with the baseline your team approved, runs optional axe-core accessibility checks and reports the result as a GitHub status check on each pull request.
What is visual regression testing?
Visual regression testing compares screenshots of your UI before and after a code change, so unintended changes to layout, colour, spacing or text are caught in review instead of in production. With Storybook, each story is a screenshot test.
How much does Framecheck cost?
Framecheck Starter is £84 a month including £25 of usage (about 50,000 web snapshots), then 50p per 1,000 snapshots. Pro is £149 a month including £50 of usage (about 110,000 web snapshots), then 45p per 1,000. Prices are in pounds sterling with no VAT added. You can try Starter for 30 days with £25 of usage (about 50,000 web snapshots) and one GitHub project, with no card required. See pricing · How we compare
What do I need to use Framecheck?
A Storybook (8.6 or newer) that builds to static files, a GitHub repository, and CI that can run a Node.js command, such as GitHub Actions. Framecheck opens a setup pull request that adds the workflow.
Put a visual check on your next pull request
Create your account, connect your Storybook repository and add Framecheck to CI.