When should I use the Radix UI skill instead of shadcn?

Use this skill when shadcn/ui doesn't offer the specific component you need (like Toolbars or Toggle Groups) or when you require lower-level control over accessibility behaviors.

Does this skill support Tailwind CSS styling?

Yes, it provides specific patterns for styling Radix components using Tailwind CSS via data-attribute selectors like data-[state=open].

What is the asChild prop mentioned in the skill?

The asChild prop is a Radix feature that allows you to merge Radix functionality onto your own custom elements, preventing unnecessary wrapper divs and maintaining clean DOM structures.

Can Claude help me install specific Radix primitives?

Absolutely. This skill provides the correct npm installation commands and usage patterns for a wide range of primitives including Toggle, Toolbar, and Visually Hidden.

Radix UI Primitives

Name: Radix UI Primitives
Author: alizain

byalizain

Herramientas de Diseño

Implements accessible, unstyled React primitives for high-quality design systems and custom UI components.

Acerca de

This skill empowers Claude to integrate Radix UI primitives directly into React projects, providing a robust solution for when shadcn/ui lacks specific components or when fine-grained accessibility control is required. It guides the AI in selecting the right primitives—such as Toggles, Toolbars, and Portals—while ensuring best practices in styling with data attributes and complex component composition. By leveraging this skill, developers can maintain WCAG compliance and professional-grade UX without building low-level logic from scratch.

Características Principales

State-based styling patterns using Radix data-attribute selectors
Automated installation of specific Radix UI primitives
Advanced UI orchestration using Portals, Slots, and Direction Providers
0 GitHub stars
Implementation of accessible design patterns like asChild composition
Expert guidance on using primitives not available in shadcn/ui

Casos de Uso

Building complex, accessible toolbars and editor interfaces
Creating custom compound components with full screen-reader support
Extending existing shadcn/ui libraries with missing low-level primitives

Acerca de

Características Principales

State-based styling patterns using Radix data-attribute selectors
Automated installation of specific Radix UI primitives
Advanced UI orchestration using Portals, Slots, and Direction Providers
0 GitHub stars
Implementation of accessible design patterns like asChild composition
Expert guidance on using primitives not available in shadcn/ui

Casos de Uso

Building complex, accessible toolbars and editor interfaces
Creating custom compound components with full screen-reader support
Extending existing shadcn/ui libraries with missing low-level primitives