ui-skills

Apply opinionated UI constraints to Tailwind CSS, React, and accessibility checks.

1|Updated Feb 2, 2026
One-click install
npx skills add https://github.com/KARENLHAO/skills --skill ui-skills-karenlhao
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: ui-skills
Source: https://github.com/KARENLHAO/skills/tree/main/ui-skills
Command: npx skills add https://github.com/KARENLHAO/skills --skill ui-skills-karenlhao

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Opinionated constraints that guide the construction of better interfaces with agents, ensuring consistency, accessibility, and performance.

Core Features & Use Cases

  • Enforces Tailwind CSS defaults and design-system conformance for UI components.
  • Advocates accessible primitives and consistent interaction patterns across surfaces.
  • Use Case: Apply these constraints to a new agent dashboard to ensure accessibility and consistency across screens.

Quick Start

Review the current UI work against the constraints to identify violations and recommended fixes.

Frequently Asked Questions about ui-skills

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I enforce design system consistency in React agent dashboards?

Apply opinionated UI constraints to agent interfaces to enforce Tailwind CSS defaults, accessible primitives, and consistent interaction patterns across React dashboards and conversational UIs, eliminating visual inconsistencies.

What are accessible interaction patterns for conversational UIs?

Accessible interaction patterns for conversational UIs require implementing accessible primitives and safe interaction patterns while avoiding unnecessary animations unless explicitly requested during the design process.

How do I check my Tailwind CSS components for accessibility violations?

Review current UI work against opinionated constraints to identify accessibility violations and generate recommended fixes for Tailwind CSS components, ensuring safe interaction patterns and accessible primitives.

Does this UI constraint approach work with existing React components?

Yes, you can apply these UI constraints to existing React components by reviewing them against Tailwind CSS defaults and design-system conformance rules without requiring additional dependencies or setup.

Why do my agent interfaces have inconsistent interaction patterns?

Agent interfaces have inconsistent interaction patterns when they lack opinionated constraints enforcing accessible primitives, Tailwind CSS defaults, and safe interaction patterns across design and development workflows.