codex

Chromatic

Chromatic workflows for CI setup, baseline ancestry and visual diff diagnosis, TurboSnap audits and preventive checks, monorepos, themes, and viewports.

1 on GitHubby Chromaticv0.2.0MITupdated 28 days agoChromatic

Plugin chromatic in chromaui/chromatic-skills. Commands read from the repo's manifest — 28 days ago.

What it installs

Skills (12)

  • chromatic-monorepo-config

    Recommend Chromatic best practices for Nx and Turborepo monorepos, including one-project versus multi-project topology, workingDir, buildCommand or outputDir, storybookBaseDir, storybookConfigDir, onlyChanged, externals, untraced, shared lockfile behavior, and TurboSnap-safe CI patterns. Use when a

  • chromatic-setup-ci

    Configure CI/CD pipelines to run Chromatic visual tests automatically. Use when the user wants to set up Chromatic in CI, add Chromatic to GitHub Actions / GitLab / Bitbucket Pipelines / CircleCI / Jenkins / Azure Pipelines, automate visual testing, or run Chromatic on every push.

  • chromatic-themes

    Configure Chromatic to capture visual test snapshots across multiple themes (light/dark mode, design tokens, branded variants) using the Modes API and @storybook/addon-themes. Use when the user wants to test components with different themes in Chromatic, set up light/dark mode visual testing, config

  • chromatic-troubleshoot-config

    Diagnose Storybook configuration issues that block Chromatic or local Storybook, including missing stories, framework or builder mismatches, addon conflicts, preview errors, static asset path issues, and package version drift. Use when Storybook fails to build, Chromatic cannot verify Storybook, sto

  • chromatic-troubleshoot-diff

    Diagnose unexpected Chromatic visual diffs, snapshot inconsistencies, font and resource loading drift, animation timing issues, viewport or globals mismatches, sticky or fixed positioning quirks, and nondeterministic story output. Use when snapshots change unexpectedly or the same code produces inco

  • chromatic-turbosnap-audit

    Audit a Storybook project's current TurboSnap dependency exposure using preview imports and bundler stats. Rank dependency footprints, identify configuration modules, and probe which inputs cause configuration bails. Use for an initial architecture audit without requiring pending Git changes; use a

  • chromatic-turbosnap-check

    Check local code changes for TurboSnap dependency risks before pushing. Build fresh Storybook stats, trace the selected Git changes, and review new preview imports or configuration modules. Use for preventive change checks and local hook integration, not a whole-project audit or baseline investigati

  • chromatic-turbosnap-compare

    Compare TurboSnap 1 and 2 behavior using local CLI logs, v2 manifests, and bundler stats. Use for migration discrepancies, unexpected preview/configuration hash changes, or files that changed on disk but were absent from the Git changed-file list.

  • chromatic-turbosnap-debug

    Diagnose TurboSnap behavior using logs, config, git context, support-shareable hosted metadata references, and targeted trace commands. Use when you need to classify why TurboSnap is enabled, disabled, unavailable, or tracing the wrong stories, then recommend the smallest valid next step.

  • chromatic-viewports

    Configure Chromatic to capture visual test snapshots at multiple viewport sizes using the Modes API. Use when the user wants to test responsive components at different screen sizes, set up viewport breakpoints for Chromatic visual testing, apply viewports to individual stories or globally, control s

  • chromatic-workflow-debug

    Diagnose Chromatic workflow issues involving git history, baselines, pull request event shape, merge queues, merge-base failures, replacement builds, and patch builds. Use when builds compare against the wrong baseline, an ancestor build is not found, pull request comparisons look wrong, or CI git c

  • diagnose-chromatic-baselines

    Diagnose Chromatic visual-test baseline ancestry with customer-owned evidence. Use when accepted changes reappear across branches, stacked PRs, merge queues, or overlapping builds, or when rebuilds use unexpected baselines. Work from build records, CLI logs, Git history, and optional customer-scoped

View source on GitHub chromatic.com

Similar plugins

storybook

claudecodex

Build, preview, and test UI components with Storybook.

7 skills

storybookjs/storybook 91,552

Specialized commands for Svelte and SvelteKit development

16 commands

davepoon/buildwithclaude 3,741

Visual diff testing with Percy, Chromatic, BackstopJS - catch unintended UI changes

1 skill · 1 command

jeremylongshore/tons-of-skills-marketplace 2,917

Create and edit React Native Storybook stories using Component Story Format (CSF). Includes controls reference, addon configuration, and portable story patterns.

3 skills · 1 MCP server

storybookjs/react-native 1,327

Opt-in reference skills split out of ork: library patterns (LangGraph, RAG, MCP, Vite, Zustand, Storybook and more) and engineering domain guides (accessibility, distributed systems, DDD, release management). Skills only, no agents or hooks. Install next to ork; invoke as /ork-extras:<skill>.

26 skills

yonatangross/orchestkit 302

Validation and quality enforcement for Storybook projects, ensuring stories always build and render correctly.

5 skills · hooks

TheBushidoCollective/han 200

Maintain Chromatic?

This page updates itself from your repo. Add the badge to your README, or get it Featured to pin it above the organic results with a followed link to your site.

claude & codex pluginslisted