tailwind-v4-shadcn
✓Configurez Tailwind v4 avec shadcn/ui en utilisant le modèle en ligne @theme et l'architecture de variables CSS. Modèle en quatre étapes : variables CSS, mappage Tailwind, styles de base, mode sombre automatique. Empêche 8 erreurs documentées. À utiliser lors de l'initialisation de projets React avec Tailwind v4, ou lors de la correction des couleurs qui ne fonctionnent pas, des erreurs tw-animate-css, des conflits de mode sombre en ligne @theme, de la rupture @apply, des problèmes de migration v3.
Installation
SKILL.md
Production-tested: WordPress Auditor (https://wordpress-auditor.webfonts.workers.dev) Last Updated: 2026-01-20 Versions: tailwindcss@4.1.18, @tailwindcss/vite@4.1.18 Status: Production Ready ✅
Critical: Define at root level (NOT inside @layer base). Use hsl() wrapper.
Why: Generates utility classes (bg-background, text-primary). Without this, utilities won't exist.
Configurez Tailwind v4 avec shadcn/ui en utilisant le modèle en ligne @theme et l'architecture de variables CSS. Modèle en quatre étapes : variables CSS, mappage Tailwind, styles de base, mode sombre automatique. Empêche 8 erreurs documentées. À utiliser lors de l'initialisation de projets React avec Tailwind v4, ou lors de la correction des couleurs qui ne fonctionnent pas, des erreurs tw-animate-css, des conflits de mode sombre en ligne @theme, de la rupture @apply, des problèmes de migration v3. Source : jezweb/claude-skills.
Faits (prêts à citer)
Champs et commandes stables pour les citations IA/recherche.
- Commande d'installation
npx skills add https://github.com/jezweb/claude-skills --skill tailwind-v4-shadcn- Source
- jezweb/claude-skills
- Catégorie
- </>Développement
- Vérifié
- ✓
- Première apparition
- 2026-02-01
- Mis à jour
- 2026-02-18
Réponses rapides
Qu'est-ce que tailwind-v4-shadcn ?
Configurez Tailwind v4 avec shadcn/ui en utilisant le modèle en ligne @theme et l'architecture de variables CSS. Modèle en quatre étapes : variables CSS, mappage Tailwind, styles de base, mode sombre automatique. Empêche 8 erreurs documentées. À utiliser lors de l'initialisation de projets React avec Tailwind v4, ou lors de la correction des couleurs qui ne fonctionnent pas, des erreurs tw-animate-css, des conflits de mode sombre en ligne @theme, de la rupture @apply, des problèmes de migration v3. Source : jezweb/claude-skills.
Comment installer tailwind-v4-shadcn ?
Ouvrez votre terminal ou outil de ligne de commande (Terminal, iTerm, Windows Terminal, etc.) Copiez et exécutez cette commande : npx skills add https://github.com/jezweb/claude-skills --skill tailwind-v4-shadcn Une fois installé, le skill sera automatiquement configuré dans votre environnement de programmation IA et prêt à être utilisé dans Claude Code ou Cursor
Où se trouve le dépôt source ?
https://github.com/jezweb/claude-skills
Détails
- Catégorie
- </>Développement
- Source
- skills.sh
- Première apparition
- 2026-02-01