ui-skills

Enforce accessible UI component constraints across React and Tailwind code reviews.

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

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Opinionated constraints for building better interfaces with agents.

Core Features & Use Cases

  • Enforce accessible component primitives and consistency across UI surfaces
  • Provide guidance for Tailwind defaults, animation rules, and design-system alignment
  • Use in UI review scenarios: building components, reviewing frontend code, and implementing interactions

Quick Start

Use the UI skills to validate a new component against the project guidelines and obtain an accessibility-compliant review.

Frequently Asked Questions about ui-skills

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

FAQPage Schema
How do I enforce UI consistency and accessibility in a React component library?

To enforce UI consistency and accessibility in a React component library, apply opinionated constraints using accessible primitives, ARIA labeling, and Tailwind defaults to validate components against unified design-system guidelines.

What guidelines should I use for accessible frontend code reviews?

For accessible frontend code reviews, use a constraint-based skill set that checks ARIA labeling, accessible component primitives, safe animation rules, and Tailwind defaults to ensure interfaces meet strict design-forward accessibility requirements.

Can I use this skill to validate Tailwind defaults and animation rules?

Yes, you can use this skill to validate Tailwind defaults and animation rules. It provides safe animation guidelines and enforces design-system alignment to ensure UI interactions remain consistent and accessible across frontend surfaces.

How do I build accessible UI components with strict design constraints?

To build accessible UI components with strict design constraints, enforce a unified set of rules covering ARIA labeling and accessible primitives during development to obtain an accessibility-compliant review of your interactions.

What is the best way to align frontend code with a design system?

The best way to align frontend code with a design system is to enforce opinionated constraints that validate component implementations against Tailwind defaults and accessibility primitives, ensuring unified design-system alignment across all UI surfaces.

Does this UI validation skill work without external dependencies?

Yes, this UI validation skill works without external dependencies. It functions as an independent guideline set to validate frontend components, enforce ARIA labeling, and review interactions without requiring additional component installations.