Percy vs Chromatic: Which MCP should you use?
Percy
Visual review platform (BrowserStack)
Chromatic
Visual testing for Storybook
TL;DR
Percy captures full-page screenshots from any E2E framework. Chromatic is tied to Storybook — it captures each story as a snapshot, plus UI review workflows for designers. If your design system lives in Storybook, Chromatic is purpose-built; for general app screenshots, Percy is the pick.
Pick Percy
Pick Percy when you test full pages from Cypress/Playwright/etc, not just components.
Pick Chromatic
Pick Chromatic when you use Storybook and want story-level visual + interaction tests.
Feature-by-feature comparison
| Feature | 👁️Percy | 🎨Chromatic | Winner |
|---|---|---|---|
| Target | Full pages / E2E | Storybook stories | Tie |
| Storybook integration | None | Native | B |
| Cross-browser snapshots | Yes | Yes (Chrome, FF, Safari, Edge) | Tie |
| Interaction testing | No | Yes (via play functions) | B |
| Review UI | Excellent | Excellent, design-oriented | Tie |
| Pricing model | Per snapshot | Per snapshot | Tie |
| Owner | BrowserStack | Storybook team (Chromatic Inc) | Tie |
| Component-level diffs | DIY | Native per story | B |
Target
TiePercy
Full pages / E2E
Chromatic
Storybook stories
Storybook integration
BPercy
None
Chromatic
Native
Cross-browser snapshots
TiePercy
Yes
Chromatic
Yes (Chrome, FF, Safari, Edge)
Interaction testing
BPercy
No
Chromatic
Yes (via play functions)
Review UI
TiePercy
Excellent
Chromatic
Excellent, design-oriented
Pricing model
TiePercy
Per snapshot
Chromatic
Per snapshot
Owner
TiePercy
BrowserStack
Chromatic
Storybook team (Chromatic Inc)
Component-level diffs
BPercy
DIY
Chromatic
Native per story
Best for
Percy
- No clear wins on the compared features — see summary and tradeoffs above.
Best for
Chromatic
- Storybook integration: Native
- Interaction testing: Yes (via play functions)
- Component-level diffs: Native per story
Migration path
Not a direct migration — they test different things. If you're killing Storybook, drop Chromatic and move your visual coverage into Percy against your real pages. If you're adopting Storybook, adding Chromatic is a few lines in CI (npx chromatic --project-token=...). Teams often run both: Chromatic for the design system, Percy for the app.
Frequently asked questions
What is the main difference between Percy and Chromatic?
Percy captures full-page screenshots from any E2E framework. Chromatic is tied to Storybook — it captures each story as a snapshot, plus UI review workflows for designers. If your design system lives in Storybook, Chromatic is purpose-built; for general app screenshots, Percy is the pick. In short: Percy — Visual review platform (BrowserStack). Chromatic — Visual testing for Storybook.
When should I pick Percy over Chromatic?
Pick Percy when you test full pages from Cypress/Playwright/etc, not just components.
When should I pick Chromatic over Percy?
Pick Chromatic when you use Storybook and want story-level visual + interaction tests.
Can I migrate from one to the other?
Not a direct migration — they test different things. If you're killing Storybook, drop Chromatic and move your visual coverage into Percy against your real pages. If you're adopting Storybook, adding Chromatic is a few lines in CI (npx chromatic --project-token=...). Teams often run both: Chromatic for the design system, Percy for the app.
Do Percy and Chromatic both work with MCP-compatible AI agents?
Neither Percy nor Chromatic is in the MCPizy directory yet. Check each vendor's own docs for an MCP server before assuming one exists.
More Testing & Browser comparisons
Playwright vs Puppeteer
Playwright (Microsoft) is the spiritual successor to Puppeteer — same core team, but cross-browser (Chromium, Firefox, WebKit), better auto-wait, built-in test runner, and first-class language bindings. Puppeteer remains solid for Chrome-only scraping/automation, but Playwright is the default for new projects.
Playwright vs Cypress
Cypress pioneered modern E2E DX (time-travel debugger, docs, VS Code-feel). Playwright caught up and surpassed on: cross-browser, multi-tab, iframe handling, parallelization, and API testing. Cypress still has the nicer 'first 30 minutes' experience; Playwright wins at scale.
Playwright vs Selenium
Selenium is the original cross-browser test framework — 20 years old, huge ecosystem, mandatory for legacy IE/old-Safari coverage. Playwright is modern, faster, has auto-wait, and doesn't need a separate driver. For new projects in 2026, Playwright wins on almost every axis except raw browser breadth.