migrate-styled-components-to-vanilla-extract

Installation
SKILL.md

Migrate styled-components to vanilla-extract

The repeatable procedure for converting a workspace's styling from styled-components (the Studio's legacy styling library) to vanilla-extract.

This skill covers the workflow: what to change, in what order, and how to verify it. The styling patterns themselves (dynamic theming, variants, keyframes, the && specificity trick, encapsulation) live in the sanity-plugin-best-practices skill's styling reference — read it first and defer to it for pattern details. For monorepo-specific policy (one plugin per PR, never during a transfer, which plugins are reference implementations), see AGENTS.md → Migrating plugin styling off styled-components.

Ground rules

  • Identical visual output is the goal. This is a refactor, not a redesign — every rule, theme token, and specificity outcome must be preserved. Verify the result against the original rendering before opening the PR.
Installs
2
GitHub Stars
20
First Seen
Oct 8, 2026