ui-skills
Opinionated constraints for building better interfaces with agents.
Security Assessment
About ui-skills
The 'ui-skills' skill provides a structured approach to creating user interfaces that are both functional and accessible. By applying opinionated constraints, it helps developers adhere to best practices and maintain consistency in UI design, addressing common pitfalls that can arise when building interfaces with agents. This skill is particularly beneficial for teams looking to enhance their user experience and ensure that their applications meet accessibility standards while leveraging modern design frameworks.
FAQ
How do I invoke the ui-skills?
You can invoke it by using the command `/ui-skills` to apply constraints to your UI work.
Can I use custom values with Tailwind CSS?
You must use Tailwind CSS defaults unless custom values exist or are explicitly requested.
What should I do if I need to animate layout properties?
You should never animate layout properties like width or height, as it is against the constraints.
Is this skill compatible with any UI framework?
This skill is specifically designed to work with Tailwind CSS, motion/react, and accessible component libraries.
Are there any limitations regarding the use of animations?
Yes, animations should only be added if explicitly requested and must adhere to specific guidelines regarding duration and properties.
Install ui-skills
Quick Setup:
- Copy the skill folder to
.claude/skills/ - Claude will automatically detect and use the skill
Repository
ibelick/ui-skills