# Add Claude design-system and accessibility workflows with UX/UI Agent Skills

> Use UX/UI Agent Skills when Claude should generate tokens, component specs, accessibility audits, and framework-specific UI code from a repeatable design workflow.

- Skill: `agentskillexchange/add-claude-design-system-and-accessibility-workflows-with-ux` (Agent Skill)
- Install (CLI): `npx skillmds@latest add agentskillexchange/add-claude-design-system-and-accessibility-workflows-with-ux`
- Raw SKILL.md: https://api.skillmd.com/api/skills/agentskillexchange/add-claude-design-system-and-accessibility-workflows-with-ux/raw
- Safety review: pending (external: skill-scanner PASS, skillspector PASS)
- Works with: Claude Code, Claude.ai, OpenAI Codex
- Category: Web & Frontend
- Author: agentskillexchange (https://skillmd.com/u/agentskillexchange)
- Updated: 2026-09-08
- Page: https://skillmd.com/skills/agentskillexchange/add-claude-design-system-and-accessibility-workflows-with-ux

---


# Add Claude design-system and accessibility workflows with UX/UI Agent Skills

Use UX/UI Agent Skills when Claude should generate tokens, component specs, accessibility audits, and framework-specific UI code from a repeatable design workflow.

## Prerequisites

Claude Code or Claude-powered IDE, ux-ui-agent-skills package or cloned repository, optional Node and Python validators for render, token, and accessibility checks

## Installation

Install or set up from the source-backed instructions:

Run npx ux-ui-agent-skills init in the target project for the full kit, or npx ux-ui-agent-skills add tokens taste design-systems to install selected areas. Alternatively, clone the repository and copy the desired skill and workflow folders into the project.

- Source: https://github.com/plugin87/ux-ui-agent-skills

## Documentation

- https://github.com/plugin87/ux-ui-agent-skills

## Source

- [Agent Skill Exchange](https://agentskillexchange.com/skills/add-claude-design-system-and-accessibility-workflows-with-ux-ui-agent-skills/)