ui-rules

Enforce unified accessible UI design policies for agent-driven interfaces.

Updated Aug 27, 2026

Search Tags:#design #accessibility #components #UI #Tailwind CSS #interaction #guidelines

Ready to run

npx skills add https://github.com/LadderChaos/tora-skills --skill ui-rules

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: ui-rules
Source: https://github.com/LadderChaos/tora-skills/tree/main/ui-rules
Command: npx skills add https://github.com/LadderChaos/tora-skills --skill ui-rules

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Opinionated interface constraints for agent-powered applications to ensure consistency, accessibility, and maintainability.

Core Features & Use Cases

Unified design primitives: reuse accessible primitives across surfaces to enforce consistency.
Accessibility-first: ensure keyboard navigation, ARIA attributes, and readable typography across components.
Interaction guidelines: define animation, timing, and state management rules to reduce cognitive load on users.
Use Case: Imagine building an agent dashboard where teams collaborate with AI to complete tasks; applying ui-rules enforces consistent visuals and predictable interactions.

Quick Start

Audit your UI surfaces against the ui-rules concise checklist and incorporate fixes in your component library.

Frequently Asked Questions about ui-rules

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

FAQPage Schema

How do I enforce accessible UI design in agent-driven dashboards?▼

Agent interface consistency is maintained by reusing accessible primitives across all component surfaces, defining interaction guidelines for animation and state management to reduce user cognitive load.

How do I audit my component library for accessible interaction guidelines?▼

You audit your component library against a concise UI constraints checklist, verifying Tailwind defaults, ARIA attributes, and interaction guidelines, then incorporate fixes directly into your components.

Does this UI design policy work with Tailwind CSS defaults?▼

Yes, the UI design policy explicitly satisfies constraints for Tailwind CSS defaults, allowing you to apply accessible primitives and interaction guidelines within your existing Tailwind component workflow.

What is the best way to standardize visuals across agent-powered applications?▼

Standardizing visuals across agent-powered applications requires a unified design policy that codifies accessible components, predictable interactions, and typography rules to ensure maintainability and reduce cognitive load.

Why do my agent dashboard components have inconsistent interaction states?▼

Agent dashboard components have inconsistent interaction states when they lack codified interaction guidelines for animation, timing, and state management, which this UI constraints skill resolves by enforcing unified primitives.