Chromatic

Chromatic is a visual testing & review tool that scans every possible UI state across browsers to catch visual and functional bugs. Assign reviewers and resolve discussions to streamline team sign-off.

UI Tests catch bugs automatically

Run visual and interaction tests across different browsers, themes, and viewports at the same time. Expansive test coverage – with no extra work.

• Test in a real browser: Chromatic takes pixel-perfect snapshots of real code, styling, and assets. Your tests reflect what your users actually experience.
• Low maintenance - high coverage: Chromatic creates tests from the Storybook stories already created during the development process. No need to write the same tests twice.
• No test flake: Our custom detection algorithm eliminates flakiness from latency, animations, resource loading, and browser state.

Scan all possible UI states to pinpoint regressions

Run two types of tests across four browsers for continuous coverage. Your tests run in parallel by default to deliver results in the least time possible.

UI Review speeds up team sign-off

Chromatic provides a unified workspace for designers, product managers, and other stakeholders to share feedback and sign-off on UI. It's like code review, but for everyone.

• Stay on top of feedback: Get notified of changes and discussion via email and pull request checks.
• Every decision in one place: Post comments and change requests right beside your live components, so that everyone can follow decision-making.
• Integrates with Git and CI: UI Review status syncs with your version control & CI to keep teams in the loop.
• Assign reviewers: Request review from design, product, and engineering in a shared workspace online.
• Set default reviewers: Automatically assign specific stakeholders to review open pull requests to speed up sign-off.
• Connects to your workflows: Keep everyone in the loop with Slack, Figma, and custom webhooks.

Publish a single source of truth

Create a searchable workspace for UI components, stories, tests, API docs, and design files. Invite your team to a shared workspace where they can reference any piece of UI across time.

• Catalog all your components: Explore UI components from across your company in one place without touching a repository.
• Stays up to date: Every time you push code your library is auto-updated.
• Searchable component libraries: Find out how and where UI components are used in your projects.
• Component API, docs, and examples: Docs, API, and example use cases from Storybook are synced with Chromatic and shown alongside your components.
• Invite your teammates: Invite developers, designers, and stakeholders by email or custom link. Assign roles for access control.
• History down to the commit: Compare components across branches & commits to review past versions.