coinbase cds
COMMUNITYLABSCO SUMMARY
Fourteen of the 21 are narrowly scoped to that monorepo itself: reviewing and writing CDS-compliant React and React Native components, turning a Figma file into CDS code, deprecating an exported API across every package that re-exports it, generating jscodeshift migrations for breaking changes, and writing docsite pages once a component ships. A few sit even further inside company process — git.backport cherry-picks a fix to a release branch, ktlo pulls the engineer's current-cycle Linear issues, and research.deprecation-usage checks Sourcegraph for who still calls a deprecated export before it is removed.
Two skills are genuinely useful outside Coinbase's own repository: cds-docs, which fetches Coinbase Design System documentation through its MCP server or the public docs route so any team already building on cds-web or cds-mobile can pull setup and API answers, and skill-creator, a generic tool for authoring and benchmarking other skills, not anything CDS-specific. If you don't work at Coinbase and aren't building on those two packages, that's effectively the whole page for you — the rest assume you can run yarn nx, have write access to the monorepo, and reach Sourcegraph and Linear internally.
READ THE FULL ANALYSIS
What each skill needs to run. Ten of the 21 are ready with no extra setup, five need a local tool already on your machine (the nx/yarn toolchain, or Figma access), three need an account key (Sourcegraph, Linear, or a Figma token), and two reach an external MCP service — the CDS docs server and, for design-to-code, Figma itself. One skill, eslint-plugin-custom-rule, we could not verify runs at all outside the monorepo's own lint config.
A public mirror of an internal monorepo. There is no section in the README describing these skills individually — everything here is Coinbase's own component library and engineering process, made visible because CDS itself is open source, not because the workflow was written for outside contributors. Its 486 stars reflect interest in the design system, not adoption of this skill set.
ALSO IN THIS PACKAGE
linear-server
Linear 的托管 MCP server:查找、创建、更新 issues/projects/comments,含专用只读端点。
http · https://mcp.linear.app/mcpfigma-dev-mode-mcp-server
The Figma MCP server brings Figma directly into your workflow by providing important design information and context to AI agents generating code from Figma design files.
http · https://mcp.figma.com/mcpcds
stdio · npx -y @coinbase/cds-mcp-serverWHAT'S INSIDE
21 showing · 21 totalNothing else to set up — install it and go.
cds-accessibility
A review of screens already built with Coinbase's design system, checking that someone using a screen reader or only a keyboard gets the labels, announcements and focus behaviour Coinbase's own documentation calls for.
cds-code
Builds or changes app screens out of Coinbase's ready-made design-system components and its named colour and spacing values, instead of hand-written styles that quietly stop matching the rest of the app.
cds-design-to-code
A designer hands over a Figma link, and it comes back as a working screen in a Coinbase app — each part of the design matched to the equivalent ready-made component instead of the raw code Figma exports.
cds-docs
Looks up the current Coinbase Design System documentation — installation, theming, and what each component can actually do — and reads it before any code is written, so nothing relies on memory.
cds-migrator-transform
Coinbase's design system renamed or moved something, and other teams' code still calls it the old way — this writes the script that goes and updates all of it for them.
components.best-practices
Anything added to Coinbase's shared component library — a button, an input, a card — has to be built to one pattern, and this sets out that pattern down to the colours and spacing sizes allowed.
components.styles
Opens up the inside of a design-system component so other teams can restyle named parts of it — the title, the icon, the outer box — instead of rebuilding their own copy.
components.write-docs
Every component on Coinbase's design-system site gets the same kind of page, and this writes that page for a new component — what it is for, how to bring it in, what each of its settings does.
deprecate-cds-api
Retires a component or hook from Coinbase's design system the proper way — marked as going away everywhere other teams can reach it, not only in the package where it was originally written.
dev.cds-mobile
Building a mobile component that belongs in Coinbase's design system — which animation and gesture libraries the team settled on, how theme values get applied, and what makes it usable for someone who cannot see the screen.
dev.cds-web
The rules a browser component has to follow inside Coinbase's design system — colours and spacing taken from the theme rather than hardcoded, and a layout that works from phone to desktop.
eslint-plugin-custom-rule
A rule the team keeps repeating in code review — do not import from the old package, say — turned into an automatic check that flags it the moment someone writes it.
feature-planner
The person with the idea only ever talks in plain words; what comes out the other end is a technical plan written for the engineer who will build it.
figma.enumerate-component-urls
A tidy list of every component in Coinbase's Figma design file, each with a link that opens it, with the private helper pieces left out.
git.backport
Copies a single fix that has already landed on the main branch onto an older release branch, on a branch of its own, and opens the pull request for it.
git.detect-breaking-changes
Reads the last few commits to Coinbase's design system and reports anything that would break the teams already using it, grouped by the package it came from.
git.repo-manager
Keeps a tidy scratch folder of downloaded copies of GitHub projects — fetching one that isn't there yet, refreshing one that is, and deleting it again once you are finished reading it.
ktlo
Gathers the tickets assigned to you for the current sprint across every team you belong to, then takes the one you pick and thinks out a plan for it, which you have to agree to before any code is written.
research.component-libs
Takes one design question and has seven well-known open-source interface libraries researched side by side, coming back with what they do the same way, where they disagree, and what Coinbase's own design system should take from it.
research.deprecation-usage
Before an old, discouraged part of Coinbase's shared interface library is deleted for good, this counts how many places across the company still rely on it, so the call to remove it rests on numbers rather than a guess.
skill-creator
Making a skill is a loop — draft it, run it on real prompts, look hard at what came back, change it, go again — and this runs that loop with you, scoring the results and comparing them against not using the skill at all.
HOW TO GET IT
npx skills add coinbase/cdsnpx skills add coinbase/cds --skill <name> --full-depthPick the skill name from the Skills tab — each entry there installs independently.