Agent skill

Cds Docs

by coinbase in coinbase/cds

Retrieve Coinbase Design System (CDS) documentation: setup, installation, theming, tokens, and per-component APIs/examples.

Apache-2.0Auto-check passedFrontend & Design

Install Cds Docs

skills CLI
$ npx skills add coinbase/cds --skill cds-docs -a claude-code

Project install by default; add -g for ~/.claude/skills/.

GitHub CLI
$ gh skill install coinbase/cds cds-docs --agent claude-code

Project scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).

Manual copy
$ git clone --depth 1 https://github.com/coinbase/cds.git skills-src && mkdir -p .claude/skills && cp -r skills-src/skills/cds-docs .claude/skills/cds-docs && rm -rf skills-src

Use ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.

Claude Code skills documentation · loads skills from .claude/skills/

Facts

Skill name
cds-docs
GitHub stars
506
Token cost
~1.1k tokens
SKILL.md length
520 words
Files
3
Skills in repo
11
Repo updated
First seen
Licence
Apache-2.0

At a glance

Retrieve Coinbase Design System (CDS) documentation: setup, installation, theming, tokens, and per-component APIs/examples.

  • Works in 5 steps: Choose platform → Tool order (try in sequence) → Workflow whenever this skill applies → …
  • The task involves CDS components
  • SKILL.md covers 1. Choose platform, 2. Tool order (try in sequence), 3. Workflow whenever this… and 4. Practical notes, plus 1 more section
  • Calls curl; reaches cds.coinbase.com

What it does

Cds Docs is an agent skill from coinbase/cds. Retrieve Coinbase Design System (CDS) documentation: setup, installation, theming, tokens, and per-component APIs/examples. Use this skill whenever the task involves CDS components, design-system rules, theming, or choosing between web and mobile CDS packages, even if the user only says "use CDS" or names a component. Always start from the docs route index, then fetch only the pages you need to reason and implement correctly. Prefer the CDS MCP server (list-cds-routes, get-cds-doc); if MCP is unavailable, use…

Its SKILL.md is about 1.1k tokens, which your agent loads only when the skill is triggered. The skill folder holds 3 other files (for example `README.md` and `evals/evals.json`).

It sits in Frontend & Design, covering Theming and dark mode, MCP servers and Design systems. It works with Model Context Protocol and Coinbase. The repository describes itself as: Coinbase Design System. The licence is Apache-2.0.

When your agent uses it

  • The task involves CDS components
  • Design-system rules
  • Choosing between web and mobile CDS packages
  • Even if the user only says use CDS

Example prompts

  • “use CDS”
  • “/cds-docs”

Workflow steps

5 steps, taken from the step headings in SKILL.md.

  1. Choose platform
  2. Tool order (try in sequence)
  3. Workflow whenever this skill applies
  4. Practical notes
  5. What “done” looks like

What it can do on your machine

Read from SKILL.md and the folder at commit 46d9e48. It shows what the files ask for, not the result of running them.

  • Tool permissions

    Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.

    From allowed-tools in the SKILL.md frontmatter.

  • Runs code

    Shell commands in SKILL.md call:

    • curl

    From the folder's file list and the shell code blocks in SKILL.md.

  • Network

    Hosts in commands or code, which the agent is likely to contact:

    • cds.coinbase.com

    From URLs in SKILL.md, links to its own repository left out.

  • Credentials

    Names no API keys, tokens, secrets or passwords.

    From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.

Context cost

Cds Docs loads about 1.1k tokens when it runs. Until then it costs about 144 tokens; SKILL.md has 520 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it
~144
When it runs · the whole SKILL.md, loaded when a task matches
~1.1k

Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.

Safety

Auto-check passed

The automated check found no risky patterns in SKILL.md.

Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.

SKILL.md

The full file from coinbase/cds at commit 46d9e48, republished under its Apache-2.0 licence (© coinbase). 520 words, ~1,125 tokens.

Download SKILL.mdSave it as .claude/skills/cds-docs/SKILL.md (or your agent's skills folder). This skill also uses 2 other files; get the full folder from GitHub.
name
cds-docs
description
Retrieve Coinbase Design System (CDS) documentation: setup, installation, theming, tokens, and per-component APIs/examples. Use this skill whenever the task involves CDS components, design-system rules, theming, or choosing between web and mobile CDS packages, even if the user only says "use CDS" or names a component. Always start from the docs route index, then fetch only the pages you need to reason and implement correctly. Prefer the CDS MCP server (`list-cds-routes`, `get-cds-doc`); if MCP is unavailable, use curl against https://cds.coinbase.com/llms/....
license
Apache-2.0
metadata.version
2.0.0

CDS Documentation Skill

Goal: Pull CDS documentation into the session so your next edits, recommendations, and API usage are grounded in current docs—not to produce a documentation handout for the user.

Treat fetched pages as source material you have read: internalize props, patterns, imports, and setup constraints, then act (code, refactors, answers) from that understanding. Quote or summarize for the user only when it helps. Keep the actual doc page contents to yourself and only share their contents directly to the user if they ask.

Whether you use the CDS MCP server or fetch the pages yourself with curl is an implementation detail. The use does not need to know your methodology unless they indicated they are debugging this skill.

Ambiguous product requests (e.g. “turn this into tabs,” “make it a card”) after you’ve read the index: if several CDS components could be relevant (e.g. underline Tabs vs pill SegmentedTabs vs TabNavigation), it is acceptable and often better to ask one short, concrete question (e.g. which visual pattern matches their spec) while briefly naming the options and how they differ per the docs. Do not pick one arbitrarily just to avoid asking.

1. Choose platform

Decide whether the work targets web (React, @coinbase/cds-web) or mobile (React Native, @coinbase/cds-mobile). If unclear, infer from the repo (e.g. package.json dependencies, apps/* layout) or ask a single clarifying question.

Pass web or mobile to list-cds-routes and when building curl URLs.

2. Tool order (try in sequence)

  1. CDS MCP server (packaged mcp-docs in @coinbase/cds-mcp-server / packages/mcp-server):

    • list-cds-routes with platform: "web" | "mobile".
    • get-cds-doc with route: path including the platform, ending in .txt (e.g. web/getting-started/installation.txt). Paths must come from the index.
  2. curl if MCP is not configured, fails, or returns errors:

    • Index: https://cds.coinbase.com/llms/web/routes.txt or https://cds.coinbase.com/llms/mobile/routes.txt
    • Page: https://cds.coinbase.com/llms/<route> where <route> matches the index (e.g. web/getting-started/theming.txt).

    Use curl -fsSL '<url>'. Prefer targeted fetches (the pages you need for this task) over loading everything; the index is for routing, not for echoing back wholesale.

Show full SKILL.md (195 more words)Show less

3. Workflow whenever this skill applies

  1. Resolve platform (web or mobile).
  2. Load the index once per platform focus (list-cds-routes or routes.txt) and use it as the canonical map of .txt paths.
  3. Fetch additional pages only as needed for the work ahead; after each fetch, apply what you learned (imports, props, patterns)—do not stop at regurgitating the file.

4. Practical notes

  • Routes are case-sensitive; doc content is .txt from MCP or HTTP.
  • Web and mobile docs differ; confirm the component or topic exists for that platform’s index.
  • Human-readable URLs inside the .txt files are optional to share with the user; your priority is correct implementation, not reproducing the doc site in the reply.

5. What “done” looks like

  • Platform is correct or explicitly chosen.
  • Index informed which pages you pulled.
  • User-facing output is implementation-focused (components, imports, structure); retrieval steps stay implicit unless the user needs them.
  • If multiple components fit, you either ground the choice in doc differences or ask one clarifying question when the product spec is under-specified.
  • Your actions and explanations reflect fetched CDS details (APIs, setup, tokens)—especially where memory would be risky—not a dump of documentation for its own sake.

© coinbase, Apache-2.0. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file

Files

SKILL.md and 2 other files in skills/cds-docs of coinbase/cds.

  • SKILL.md
  • README.md
  • evals/evals.json

Open the folder on GitHubat commit 46d9e48

Compare with similar skills

Cds Docs next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.

Cds Docs compared with similar skills
SkillStarsUsed inTokensAuto-checkLicenceRepo updated
Cds Docs this skillcoinbase/cds506—~1.1kAutomated safety check: PassApache-2.0
Igniteui Angular Generate From Image DesignIgniteUI/igniteui-angular599—~4.7kAutomated safety check: PassMIT
Igniteui Angular Figma To AppIgniteUI/igniteui-angular599—~6.4kAutomated safety check: PassMIT
Shadcn UIBuilderIO/agent-native7.1k—~3kAutomated safety check: PassNone
Fast Agent Designevalstate/fast-agent3.9k—~220Automated safety check: PassApache-2.0
Igniteui Wc Figma To AppIgniteUI/igniteui-webcomponents170—~7.2kAutomated safety check: PassMIT

Similar skills

  • Implements Angular application views from design images using Ignite UI Angular components.

    599 GitHub stars~4.7k tokensUpdated yesterday
    Frontend & DesignAuto-check passed
  • Igniteui Angular Figma To App

    IgniteUI/igniteui-angular

    Builds Angular views from Figma designs with Ignite UI for Angular, supporting Indigo.Design kits, third-party kits, and plain frames.

    599 GitHub stars~6.4k tokensUpdated yesterday
    Frontend & DesignAuto-check passed
  • Shadcn UI

    BuilderIO/agent-native

    Project-aware shadcn/ui components, registry MCP, theming, and design-system lint feedback.

    7.1k GitHub stars~3k tokensUpdated today
    Frontend & DesignAuto-check passed
  • Fast Agent Design

    evalstate/fast-agent

    A skill your agent uses to generate well-branded interfaces and assets for fast-agent, either for production or throwaway prototypes/mocks/etc.

    3.9k GitHub stars~220 tokensUpdated today
    Frontend & DesignAuto-check passed
  • Igniteui Wc Figma To App

    IgniteUI/igniteui-webcomponents

    Builds Ignite UI Web Components views from Figma designs, supporting Indigo.Design kits, third-party kits (Material 3, Fluent 2, shadcn/ui, Untitled UI, in-house), and plain frames.

    170 GitHub stars~7.2k tokensUpdated yesterday
    Frontend & DesignAuto-check passed
  • MCP Development

    coollabsio/coolify

    A skill your agent uses for Laravel MCP development. An agent skill from coollabsio/coolify.

    63k GitHub starsUsed in 1 repo~949 tokens
    Frontend & DesignAuto-check passed

More from coinbase/cds

All 11 skills in this repo
  • A skill your agent uses when a CDS change in cds-web, cds-common, cds-mobile, web-visualization, or mobile-visualization needs a jscodeshift migration in packages/migrator to update callers or…

    506 GitHub stars~3.4k tokensUpdated yesterday
    Auto-check passed
  • Deprecate Cds API

    coinbase/cds

    Deprecates a CDS component, hook, or other exported symbol with consistent JSDoc, version tags, and docsite metadata across every public export path (web, mobile, common, visualization), not only…

    506 GitHub stars~2.6k tokensUpdated yesterday
    Auto-check passed
  • USE THIS when migrating a CDS React Native component to native iOS, or when writing or reviewing SwiftUI in packages/cds-ios or apps/ios-gallery.

    506 GitHub stars~3k tokensUpdated yesterday
    Auto-check passed
  • USE THIS when writing or reviewing Jetpack Compose / Kotlin code in packages/cds-android or apps/android-app - @Composable APIs, Modifier parameters, CompositionLocal, state hoisting, or naming.

    506 GitHub stars~805 tokensUpdated yesterday
    Auto-check passed
  • Cds Design To Code

    coinbase/cds

    Turn Figma designs into CDS React (cds-web) or React Native (cds-mobile) code.

    506 GitHub stars~4.9k tokensUpdated yesterday
    Auto-check passed
  • USE THIS when asked to create a new eslint plugin rule for the eslint-plugin-cds package

    506 GitHub stars~731 tokensUpdated yesterday
    Auto-check passed

Questions about Cds Docs

What does Cds Docs do?

Retrieve Coinbase Design System (CDS) documentation: setup, installation, theming, tokens, and per-component APIs/examples. Cds Docs is an agent skill from coinbase/cds. Retrieve Coinbase Design System (CDS) documentation: setup, installation, theming, tokens, and per-component APIs/examples.

When should I use Cds Docs?

Cds Docs fits situations like: the task involves CDS components; design-system rules; choosing between web and mobile CDS packages; even if the user only says use CDS.

How do I install Cds Docs in Claude Code?

Run `npx skills add coinbase/cds --skill cds-docs -a claude-code`. Or copy the skill folder (skills/cds-docs in coinbase/cds) into .claude/skills/cds-docs in your project. Claude Code loads it when a task matches its description.

How do I install Cds Docs in Codex?

Run `npx skills add coinbase/cds --skill cds-docs -a codex`. Or copy the skill folder (skills/cds-docs in coinbase/cds) into .agents/skills/cds-docs in your project. Codex loads it when a task matches its description.

Can I use Cds Docs in Cursor, Gemini CLI or GitHub Copilot?

Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add coinbase/cds --skill cds-docs -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/cds-docs, .gemini/skills/cds-docs, .github/skills/cds-docs and .opencode/skills/cds-docs in your project.

What does Cds Docs need to run?

Going by SKILL.md and its folder, Cds Docs needs the command-line tools its instructions call (curl).

Does Cds Docs access the network?

SKILL.md names 1 domain. In commands or code: cds.coinbase.com; the agent is likely to contact it when it follows the instructions. This is read from the text; nothing was executed.

Is Cds Docs safe to install?

Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. Review the folder before installing.

What licence does Cds Docs use?

Cds Docs is published under the Apache-2.0 licence (declared in SKILL.md). It allows redistribution, so the full SKILL.md is shown on this page.

How many tokens does Cds Docs use?

About 1.1k tokens (SKILL.md is roughly 4.5k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full.

What are the alternatives to Cds Docs?

Skills that share tags, products or a category with Cds Docs: Igniteui Angular Generate From Image Design (IgniteUI/igniteui-angular, 599 stars), Igniteui Angular Figma To App (IgniteUI/igniteui-angular, 599 stars), Shadcn UI (BuilderIO/agent-native, 7.1k stars) and Fast Agent Design (evalstate/fast-agent, 3.9k stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains Cds Docs?

coinbase (a GitHub organization) maintains it in coinbase/cds, which has 506 GitHub stars. The repository holds 11 skills in this directory. The repository was last updated on October 6, 2026.

Source: coinbase/cds on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.