ui-skills

Enforce opinionated UI constraints for agent-driven interfaces with Tailwind CSS.

Updated Nov 10, 2018
One-click install
npx skills add https://github.com/GLaDO8/dotfiles --skill ui-skills-glado8
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: ui-skills
Source: https://github.com/GLaDO8/dotfiles/tree/main/claude/backup/skills/ui-skills
Command: npx skills add https://github.com/GLaDO8/dotfiles --skill ui-skills-glado8

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill defines a compact, opinionated set of UI constraints to guide the design and development of agent-driven interfaces, reducing ambiguity and improving consistency.

Core Features & Use Cases

  • Opinionated constraints that govern UI primitives, accessibility, and interaction patterns for agent-assisted workflows.
  • Comprehensive guidance covering stack defaults (Tailwind CSS), motion usage, typography, layout, and component primitives to ensure cohesive experiences.
  • Use Case: apply these constraints when building agent chat UIs, dashboards, and form-like interfaces to maintain consistency and quality across components.

Quick Start

Use the ui-skills to apply its constraints to UI work in this conversation.

  • /ui-skills
  • /ui-skills <file>

Frequently Asked Questions about ui-skills

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

FAQPage Schema
What are UI constraints for agent interfaces and why do I need them?

UI constraints for agent interfaces are opinionated rules governing accessibility, motion, and interaction patterns. You need them to reduce ambiguity and ensure consistent, maintainable experiences across conversational UIs and agent-assisted dashboards.

How do I enforce accessibility and consistency in agent chat UIs?

Enforce accessibility and consistency in agent chat UIs by applying codified constraints for stack defaults, component primitives, and interaction patterns. This ensures predictable interactions and maintainable interfaces across conversational workflows.

Does this UI constraint skill work with Tailwind CSS?

Yes, this UI constraint skill works directly with Tailwind CSS. It codifies Tailwind as the stack default for layout and typography, ensuring cohesive design system implementation across agent-driven dashboards and interactive components.

Can I use these design system constraints for dashboards and form-like interfaces?

Yes, you can use these design system constraints for dashboards and form-like interfaces. The skill applies opinionated rules covering typography, layout, and component primitives to maintain quality across various agent-assisted workflows.

What's the best way to standardize motion and typography in conversational UIs?

The best way to standardize motion and typography in conversational UIs is to apply compact, opinionated constraints that govern stack defaults and interaction patterns. This approach ensures cohesive experiences and predictable agent-assisted interactions.

When should I not use opinionated UI constraints for agent-driven interfaces?

You should avoid using opinionated UI constraints for agent-driven interfaces when your project requires highly custom interaction patterns or a non-Tailwind stack, as these constraints are specifically codified for Tailwind CSS defaults and predictable agent workflows.