SkillsAdd

smithery/yuniorglez

ui-ux-specialist

Senior Accessibility & Frontend Engineer. Expert in WCAG 2.2 standards, Semantic HTML, and Inclusive Design for 2026.

Installation

$ npx skills add smithery/yuniorglez --skill ui-ux-specialist
View on skills.sh ↗ Website ↗

Similar popular skills

Related neighbors and high-traction skills in the same topics — useful to compare before installing.

frontend-design Same topic
anthropics/skills

Guidance for distinctive, intentional visual design when building new UI or reshaping an existi…

866.4K installs
agent-browser Same topic
vercel-labs/agent-browser

Browser automation CLI for AI agents. Use when the user needs to interact with websites, includ…

810.4K installs
vercel-react-best-practices Same topic
vercel-labs/agent-skills 697.8K installs
web-design-guidelines Same topic
vercel-labs/agent-skills

Review UI code for Web Interface Guidelines compliance. Use when asked to "review my UI", "chec…

617.3K installs
microsoft-foundry Same topic
microsoft/azure-skills

Build, deploy, evaluate, optimize, fine-tune, and manage Microsoft Foundry agents, models, and …

576.5K installs
azure-diagnostics Same topic
microsoft/azure-skills

Debug Azure production issues on Azure using AppLens, Azure Monitor, resource health, and safe …

568.9K installs

Also in this package

Other skills from smithery/yuniorglez · top by installs.

npx skills add smithery/yuniorglez
zustand-expert 0 vercel-sync 0 utility-pro 0 ui-ux-pro 0 track-master 0 tanstack-query-expert 0 subagent-orchestrator 0 stripe-expert 0 strict-auditor 0 shadcn-ui-expert 0

Browse all from smithery/yuniorglez

More details

Agent compatibility

Declared targets from SKILL.md / docs. Unmarked agents are not listed — the skill may still install via the CLI.

Claude Code Not declared
Cursor Not declared
Codex Not declared
GitHub Copilot Not declared
Windsurf Not declared
Gemini CLI Not declared
Cline Not declared
OpenCode Not declared

Skill metadata

Parsed from SKILL.md frontmatter.

Version1.1.0

Package contents

Files included with this skill beyond the listing page.

  • skill md SKILL.md 3,324 B
  • docs SUMMARY.md 141 B

History

  1. First recorded snapshot · 0 installs

SKILL.md

♿ Skill: UI/UX & Accessibility Specialist (v1.1.0)

Executive Summary

The ui-ux-specialist is the champion of inclusivity and technical frontend excellence. In 2026, accessibility is not a "feature"—it is a human right and a legal requirement (WCAG 2.2). This skill focuses on building semantic, keyboard-navigable, and high-performance interfaces that work for everyone, regardless of their physical or cognitive abilities. We build for Inclusive Success.

📋 Table of Contents

  1. [Priorities for Frontend Excellence](#priorities-for-frontend-excellence)
  2. [The "Do Not" List (Anti-Patterns)](#the-do-not-list-anti-patterns)
  3. [WCAG 2.2 AA Standards](#wcag-22-aa-standards)
  4. [Semantic HTML & ARIA](#semantic-html--aria)
  5. [Responsive & Fluid Interaction](#responsive--fluid-interaction)
  6. [Inclusive Design Patterns](#inclusive-design-patterns)
  7. [Reference Library](#reference-library)

🏗️ Priorities for Frontend Excellence

  1. Semantic Integrity: Use the right HTML tag for the right job. No "div-only" interfaces.
  2. Keyboard Navigability: Every interactive element must be reachable and operable via Tab/Enter/Space.
  3. Visual Clarity: High contrast, clear focus indicators, and consistent typography.
  4. Error Resilience: Forgiving forms and clear error recovery paths.
  5. Performance Budgets: Ensuring that accessibility features don't bloat the load time.

🚫 The "Do Not" List (Anti-Patterns)

Anti-Pattern Why it fails in 2026 Modern Alternative
div Buttons Invisible to screen readers and keyboard users. Use <button> or role="button".
Fixed Font Sizes Breaks for users with visual impairments. Use rem and responsive scaling.
Color-Only State Inaccessible to color-blind users. Use Icons and Text Labels.
Missing Focus Rings Confuses keyboard users. Use focus-visible high-contrast rings.
Autoplay Video Jarring for cognitive/vestibular disorders. Use prefers-reduced-motion.

📏 WCAG 2.2 AA Standards

Compliance is mandatory:

  • Target Size: Minimum 24x24px for all touch/click areas.
  • Focus Preservation: indicators never hidden by overlays.
  • Contrast: 4.5:1 for text; 3:1 for UI elements.

See [References: WCAG 2.2](./references/wcag-2-2-standards.md) for details.

🧱 Semantic HTML & ARIA

  • Landmarks: <main>, <nav>, <aside>.
  • ARIA: Only use when native HTML is insufficient.
  • Forms: Explicit labels and aria-describedby for hints.

📖 Reference Library

Detailed deep-dives into UI/UX Implementation:

  • [WCAG 2.2 Standards](./references/wcag-2-2-standards.md): Compliance and success criteria.
  • [Semantic HTML & ARIA](./references/semantic-html-aria.md): Building a solid foundation.
  • [Inclusive Design](./references/inclusive-design-patterns.md): Designing for human diversity.
  • [UI Patterns](../ui-ux-pro/SKILL.md): Visual and structural design standards.

Updated: January 22, 2026 - 20:05