responsive-styling
✓Générez automatiquement du CSS/SCSS réactif adapté aux mobiles lors de la création de styles de composants ou de la mention d'un design réactif. Implémente des points d'arrêt standard (768 px, 1 024 px), garantit le contraste des couleurs WCAG AA, crée des interfaces tactiles (cibles minimales de 44 px), ajoute des indicateurs de mise au point appropriés, prend en charge la réduction des mouvements, met à l'échelle la typographie de manière réactive et fournit des spécifications techniques détaillées avec des valeurs exactes.
Installation
SKILL.md
Purpose Generate mobile-first, responsive CSS/SCSS that works across all devices and follows accessibility best practices.
Mobile-First Approach Always write base styles for mobile, then enhance for larger screens:
❌ Desktop-first (using max-width) ❌ Magic numbers (random breakpoints) ❌ Forgetting touch targets ❌ Fixed pixel widths that don't scale ❌ Tiny text on mobile (<16px) ❌ Horizontal scrolling ❌ Ignoring landscape mobile ❌ Breaking at intermediate sizes
Générez automatiquement du CSS/SCSS réactif adapté aux mobiles lors de la création de styles de composants ou de la mention d'un design réactif. Implémente des points d'arrêt standard (768 px, 1 024 px), garantit le contraste des couleurs WCAG AA, crée des interfaces tactiles (cibles minimales de 44 px), ajoute des indicateurs de mise au point appropriés, prend en charge la réduction des mouvements, met à l'échelle la typographie de manière réactive et fournit des spécifications techniques détaillées avec des valeurs exactes. Source : kanopi/cms-cultivator.
Faits (prêts à citer)
Champs et commandes stables pour les citations IA/recherche.
- Commande d'installation
npx skills add https://github.com/kanopi/cms-cultivator --skill responsive-styling- Source
- kanopi/cms-cultivator
- Catégorie
- </>Développement
- Vérifié
- ✓
- Première apparition
- 2026-02-01
- Mis à jour
- 2026-02-18
Réponses rapides
Qu'est-ce que responsive-styling ?
Générez automatiquement du CSS/SCSS réactif adapté aux mobiles lors de la création de styles de composants ou de la mention d'un design réactif. Implémente des points d'arrêt standard (768 px, 1 024 px), garantit le contraste des couleurs WCAG AA, crée des interfaces tactiles (cibles minimales de 44 px), ajoute des indicateurs de mise au point appropriés, prend en charge la réduction des mouvements, met à l'échelle la typographie de manière réactive et fournit des spécifications techniques détaillées avec des valeurs exactes. Source : kanopi/cms-cultivator.
Comment installer responsive-styling ?
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/kanopi/cms-cultivator --skill responsive-styling 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/kanopi/cms-cultivator
Détails
- Catégorie
- </>Développement
- Source
- skills.sh
- Première apparition
- 2026-02-01