frontend-tailwind-best-practices
✓Tailwind CSS patterns and conventions for frontend apps. Use when writing component styles, layouts, or working with CSS classes.
Installation
SKILL.md
Styling patterns and conventions for frontend applications. Contains 10 rules covering layout utilities, affordances, color schemes, responsive design, and className handling.
Design for input capabilities (pointer/hover) instead of device labels.
| flex flex-col | v-stack | | flex flex-row | h-stack | | flex items-center justify-center | center | | bg-gray-100 | bg-neutral-100 | | bg-[#hex] | Use design tokens | | className="..." without cn() | cn("...", className) | | Inline style for responsive | Tailwind prefixes |
Tailwind CSS patterns and conventions for frontend apps. Use when writing component styles, layouts, or working with CSS classes. Source: sergiodxa/agent-skills.
Facts (cite-ready)
Stable fields and commands for AI/search citations.
- Install command
npx skills add https://github.com/sergiodxa/agent-skills --skill frontend-tailwind-best-practices- Source
- sergiodxa/agent-skills
- Category
- </>Dev Tools
- Verified
- ✓
- First Seen
- 2026-02-01
- Updated
- 2026-02-18
Quick answers
What is frontend-tailwind-best-practices?
Tailwind CSS patterns and conventions for frontend apps. Use when writing component styles, layouts, or working with CSS classes. Source: sergiodxa/agent-skills.
How do I install frontend-tailwind-best-practices?
Open your terminal or command line tool (Terminal, iTerm, Windows Terminal, etc.) Copy and run this command: npx skills add https://github.com/sergiodxa/agent-skills --skill frontend-tailwind-best-practices Once installed, the skill will be automatically configured in your AI coding environment and ready to use in Claude Code or Cursor
Where is the source repository?
https://github.com/sergiodxa/agent-skills
Details
- Category
- </>Dev Tools
- Source
- skills.sh
- First Seen
- 2026-02-01