Skills
.Work. You
Rest

development-cds-web

Official

Develop CDS React components

Software Engineering#accessibility#web development#react#design system#css#component development
Authorcoinbase
Version1.0.0
Installs0

System Documentation

What problem does it solve?

This Skill provides guidelines and best practices for developing new or modifying existing web-based React components within the Coinbase Design System (CDS).

Core Features & Use Cases

  • Styling with Linaria: Enforces the use of Linaria for zero-runtime CSS, emphasizing the use of CDS theme CSS variables for consistency.
  • Responsive Design: Details how to implement responsive styles using breakpoint values and the Box component's responsive prop API.
  • Accessibility: Outlines essential accessibility considerations, including ARIA attributes, keyboard navigation, and WCAG compliance.
  • Use Case: A developer needs to create a new button component for the CDS web application, ensuring it adheres to all styling, theming, and accessibility standards.

Quick Start

Follow the guidelines in this skill to create a new CDS React component for the web.

Dependency Matrix

Required Modules

None required

Components

references

💻 Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: development-cds-web
Download link: https://github.com/coinbase/cds/archive/main.zip#development-cds-web

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 223,000+ vetted skills library on demand.