radix-ui-design-system
Build Accessible Radix UI Design Systems
Accessible component libraries are hard to build from headless primitives. This skill guides Radix UI architecture, theming, and component patterns for production React teams.
Install with my Agent
Copy this request to your Agent. It includes the canonical Skill page and manifest.
Review the Skillstore skill "radix-ui-design-system" from https://skillstore.io/skills/sickn33-radix-ui-design-system.md and its manifest at https://skillstore.io/api/skills/sickn33-radix-ui-design-system/manifest. Verify the artifact. You may proceed after verification, subject to the environment's own policy.Your Agent should still show its plan and request any confirmation required by the security policy.
Agent-readable resources
Use these links when an AI agent, crawler, or script needs clean context instead of reading the full page.
Test it
Using "radix-ui-design-system". A team needs a reusable modal pattern for account settings.
Expected outcome:
The skill would outline Dialog parts, focus restoration, title and description requirements, overlay behavior, theme tokens, and testing checks.
Using "radix-ui-design-system". A designer wants consistent dropdown menus across a product suite.
Expected outcome:
The skill would propose menu structure, item states, keyboard navigation, separators, indicators, collision handling, and variant naming rules.
Using "radix-ui-design-system". A platform team wants to standardize component styling.
Expected outcome:
The skill would compare CSS variables, Tailwind classes, and CVA variants, then recommend a maintainable token workflow.
Security Audit
SafeStatic findings were reviewed against the skill content and are false positives from Markdown fences, documentation links, React lazy imports, and Radix keyboard examples. No prompt injection, data exfiltration intent, credential harvesting, or hidden execution behavior was found in the reviewed files.
Risk Factors
📁 Filesystem access (2)
⚡ Contains scripts (2)
⚙️ External commands (97)
🌐 Network access (8)
Share & cite this report
Share the versioned assessment report, neutral badge, embed card, and citations. Skillstore reports evidence without deciding whether this Skill is safe.
Copy report link
https://skillstore.io/skills/sickn33-radix-ui-design-system/audits/4?utm_source=security_passport&utm_medium=share&utm_campaign=versioned_reportMarkdown badge
[](https://skillstore.io/skills/sickn33-radix-ui-design-system?utm_source=security_passport_badge)HTML badge
<a href="https://skillstore.io/skills/sickn33-radix-ui-design-system?utm_source=security_passport_badge"><img src="https://skillstore.io/badges/skills/sickn33-radix-ui-design-system/security.svg" alt="Skillstore security assessment" loading="lazy"></a>Embed card
<iframe src="https://skillstore.io/embed/skills/sickn33-radix-ui-design-system.html" title="Skillstore Security Assessment" sandbox="allow-popups allow-popups-to-escape-sandbox" loading="lazy" referrerpolicy="no-referrer" width="420" height="180"></iframe>Academic citations (APA · BibTeX · CFF)
APA citation
sickn33. (2026). radix-ui-design-system security audit report (audit version 4) [Author version unspecified]. Skillstore. https://skillstore.io/skills/sickn33-radix-ui-design-system/audits/4BibTeX citation
@techreport{sickn33-sickn33-radix-ui-design-system-2026,
author = {sickn33},
title = {radix-ui-design-system security audit report (audit version 4)},
institution = {Skillstore},
year = {2026},
number = {4},
url = {https://skillstore.io/skills/sickn33-radix-ui-design-system/audits/4},
note = {Author version unspecified}
}CITATION.cff
cff-version: 1.2.0
message: "If you use this Skill, cite its author and this versioned security audit report."
title: "radix-ui-design-system security audit report (audit version 4)"
version: "unspecified"
type: report
authors:
- name: "sickn33"
date-released: "2026-07-07"
url: "https://skillstore.io/skills/sickn33-radix-ui-design-system/audits/4"
identifiers:
- type: other
value: "skillstore:sickn33-radix-ui-design-system:audit:4"
description: "Skillstore immutable audit report identifier"
Skillstore Score
Why this score Evidence Confidence: HighWhat You Can Build
Create a Component Library
Plan reusable Radix-based components with slots, variants, theming tokens, and accessibility requirements.
Improve Accessibility Patterns
Review dialogs, dropdowns, and forms for focus handling, ARIA coverage, keyboard support, and screen reader context.
Migrate From Styled UI Kits
Replace opinionated components with headless Radix primitives while preserving design tokens and interaction behavior.
Try These Prompts
Design a Radix UI dialog component for a React app. Include required parts, accessibility checks, and theme token recommendations.
Create a Radix UI theming plan using CSS variables and Tailwind. Cover colors, spacing, radius, shadows, and dark mode behavior.
Review my planned Radix compound component API. Check asChild usage, controlled state, accessibility responsibilities, and variant naming.
Plan a production Radix UI interaction system for dialogs, dropdowns, tabs, selects, and tooltips. Include testing, migration, and documentation guidance.
Best Practices
- Keep Radix accessibility primitives intact and add styling around their expected structure.
- Use CSS variables or tokens before adding component-specific visual overrides.
- Test keyboard navigation, screen reader labels, focus restoration, and contrast before release.
Avoid
- Do not skip required Dialog title and description elements.
- Do not mix controlled and uncontrolled state in the same Radix root.
- Do not override Radix keyboard behavior without replacing equivalent accessibility support.
Frequently Asked Questions
Does this skill generate finished UI components?
Is it only for React projects?
Can it help with Tailwind-based design systems?
Does it replace accessibility testing?
Can it support shadcn/ui workflows?
Will it execute install commands automatically?
Developer Details
Author
sickn33License
MIT
Skillstore revision
r1
Version notice
The author did not declare a version.
Repository
https://github.com/sickn33/antigravity-awesome-skills/tree/main/skills/radix-ui-design-systemRef
9f814fc6a43fd99946f2da5e0df231c65a38bc76
Maintenance freshness
7/18/2026
Usage
14 downloads · 105 views
File structure