Provides Tailwind CSS 4 best practices for class naming and theming.
npx skills add https://github.com/phar-dev/phardev.dot --skill tailwind-4-phar-dev
Please help me install this Agent Skill. Skill: tailwind-4 Source: https://github.com/phar-dev/phardev.dot/tree/main/opencode/.config/opencode/skills/tailwind Command: npx skills add https://github.com/phar-dev/phardev.dot --skill tailwind-4-phar-dev
Tailwind CSS 4 patterns and best practices streamline consistent styling, reduce confusion, and help teams avoid common pitfalls like using var() in className or hex colors.
Refactor a component to follow Tailwind-4 guidelines by replacing var() and hex colors with semantic classes and using cn() for conditional styling.
High-intent search queries and answers about installing and using this skill.
Avoid using var() directly in className attributes; instead, use semantic color classes and theme variables to maintain consistency, simplify design system updates, and prevent styling conflicts.
Avoid using var() and hex colors directly in className attributes; instead, apply semantic Tailwind CSS classes to maintain consistency, simplify design system updates, and prevent styling conflicts.
The best way to refactor components for Tailwind 4 is replacing inline hex colors and var() calls with semantic classes, while applying cn() for conditional styling to ensure production-ready UI.
Migrate a design system to Tailwind CSS 4 by replacing hardcoded hex colors with semantic color classes and theme variables, ensuring scalable UI implementations and consistent styling.
Common Tailwind CSS pitfalls include using var() in className, applying inline hex colors, and poor conditional styling management, which can be fixed using cn() and semantic classes.
mjamoreConfigure Tailwind CSS v4 styling in Expo projects with NativeWind and Metro.
hirefrankDetect insufficient shadcn/ui component customization in Tanstack Start React apps.
prowler-cloudCodifies Tailwind 4 className patterns for dynamic styling and variants.
FlorianRiquelmeStandardize CSS across frameworks with consistent methodology and production optimization.
