How to Run Chromatic for Storybook in CI

Chromatic builds your Storybook, snapshots every story in its cloud, and needs only the chromatic CLI plus a project token in CI.

Run the chromatic CLI with --project-token; it builds Storybook, uploads it, and captures one snapshot per story for review against the last accepted baseline.

Steps

Install chromatic as a dev dependency.
Store the project token as the CHROMATIC_PROJECT_TOKEN secret.
Run npx chromatic in CI on each push.
Review and accept changes in the Chromatic UI.

Install

Terminal

npm install --save-dev chromatic

Workflow

.github/workflows/ci.yml

jobs:
  chromatic:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4
        with:
          fetch-depth: 0
      - uses: actions/setup-node@v4
        with:
          node-version: '20'
      - run: npm ci
      - run: npx chromatic --project-token=${{ secrets.CHROMATIC_PROJECT_TOKEN }}

Gotchas

Chromatic needs full git history (fetch-depth: 0) to compare against the correct baseline commit.
A shallow clone makes it snapshot every story as new each run.