tailwind-patterns
✓Modèles CSS Tailwind prêts pour la production pour les composants de sites Web courants : mises en page réactives, cartes, navigation, formulaires, boutons et typographie. Comprend une échelle d'espacement, des points d'arrêt, des modèles axés sur le mobile et la prise en charge du mode sombre. À utiliser lors de la création de composants d'interface utilisateur, de la création de pages de destination, du style de formulaires, de la mise en œuvre de la navigation ou de la correction de mises en page réactives.
Installation
SKILL.md
Status: Production Ready ✅ Last Updated: 2026-01-14 Tailwind Compatibility: v3.x and v4.x Source: Production projects, shadcn/ui patterns
| Tight spacing | gap-2 p-2 space-y-2 | 0.5rem (8px) | | Standard spacing | gap-4 p-4 space-y-4 | 1rem (16px) | | Comfortable | gap-6 p-6 space-y-6 | 1.5rem (24px) | | Loose | gap-8 p-8 space-y-8 | 2rem (32px) | | Section spacing | py-16 sm:py-24 | 4rem/6rem (64px/96px) |
Standard Pattern: Use increments of 4 (4, 6, 8, 12, 16, 24)
Modèles CSS Tailwind prêts pour la production pour les composants de sites Web courants : mises en page réactives, cartes, navigation, formulaires, boutons et typographie. Comprend une échelle d'espacement, des points d'arrêt, des modèles axés sur le mobile et la prise en charge du mode sombre. À utiliser lors de la création de composants d'interface utilisateur, de la création de pages de destination, du style de formulaires, de la mise en œuvre de la navigation ou de la correction de mises en page réactives. 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-patterns- 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-patterns ?
Modèles CSS Tailwind prêts pour la production pour les composants de sites Web courants : mises en page réactives, cartes, navigation, formulaires, boutons et typographie. Comprend une échelle d'espacement, des points d'arrêt, des modèles axés sur le mobile et la prise en charge du mode sombre. À utiliser lors de la création de composants d'interface utilisateur, de la création de pages de destination, du style de formulaires, de la mise en œuvre de la navigation ou de la correction de mises en page réactives. Source : jezweb/claude-skills.
Comment installer tailwind-patterns ?
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-patterns 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