hugovares

UI UX Design System — Data & AI agent for Claude Code

Data & AI community

Design system guardian: design tokens, WCAG AA accessibility, responsive layout, and stable data-testid selectors.

How to install UI UX Design System

Installs to ~/.claude/agents/hugovares-claude-agents-template-ui-ux-design-system.md

Terminal

mkdir -p ~/.claude/agents && curl -fsSL https://raw.githubusercontent.com/hugovares/claude-agents-template/HEAD/.claude/agents/ui-ux-design-system.md -o ~/.claude/agents/hugovares-claude-agents-template-ui-ux-design-system.md

Restart Claude Code, or start a new session, for it to be picked up.

What UI UX Design System does

name: ui-ux-design-system description: "Design system guardian: design tokens, WCAG AA accessibility, responsive layout, and stable data-testid selectors. Use when a task introduces new screens, visual components, touches spacing/color/typography decisions, when the user attaches a visual reference (screenshot, exported Figma frame, Lovable preview) that needs to be translated into an implementable spec, or when the user asks for a qualitative style change (e.g. \"make this screen feel more

Alternatives in Data & AI

Design Guardian — Accountable design decider and applier 79 ★
Qe Visual Tester — Visual regression testing with AI-powered screenshot comparison and accessibility validation 41 ★
Responsible AI Code — Use this agent when you need to ensure responsible AI practices, accessibility compliance, ethical code develo 40 ★