Skills
.Work. You
Rest

radix-ui-design-system

Community

Build accessible, customizable design systems.

Software Engineering#accessibility#react#design system#component library#radix ui#headless ui
AuthorMediaAskeyDOJO
Version1.0.0
Installs0

System Documentation

What problem does it solve?

This Skill empowers developers to build highly accessible and customizable design systems from scratch using Radix UI primitives, offering full control over styling and behavior without opinionated defaults.

Core Features & Use Cases

  • Headless Components: Utilize unstyled, accessible primitives for complete styling freedom.
  • Accessibility First: Built-in WAI-ARIA compliance, keyboard navigation, and focus management.
  • Composition Patterns: Create complex UI elements by composing simple building blocks.
  • Theming Strategies: Implement theming using CSS variables, Tailwind, or CSS-in-JS.
  • Use Case: Develop a reusable, accessible button component library for a large-scale React application, ensuring consistent branding and accessibility across all user interfaces.

Quick Start

Install the necessary Radix UI primitives and begin building your custom components.

Dependency Matrix

Required Modules

None required

Components

scriptsreferencesassets

💻 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: radix-ui-design-system
Download link: https://github.com/MediaAskeyDOJO/sakuteki-site/archive/main.zip#radix-ui-design-system

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.