responsive-styling
✓Generieren Sie automatisch responsives CSS/SCSS für Mobilgeräte, wenn Sie Komponentenstile erstellen oder responsives Design erwähnen. Implementiert Standard-Haltepunkte (768 Pixel, 1024 Pixel), stellt den WCAG AA-Farbkontrast sicher, erstellt berührungsfreundliche Schnittstellen (Mindestziele 44 Pixel), fügt geeignete Fokusindikatoren hinzu, unterstützt reduzierte Bewegung, skaliert die Typografie reaktionsschnell und stellt detaillierte technische Spezifikationen mit genauen Werten bereit.
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
Generieren Sie automatisch responsives CSS/SCSS für Mobilgeräte, wenn Sie Komponentenstile erstellen oder responsives Design erwähnen. Implementiert Standard-Haltepunkte (768 Pixel, 1024 Pixel), stellt den WCAG AA-Farbkontrast sicher, erstellt berührungsfreundliche Schnittstellen (Mindestziele 44 Pixel), fügt geeignete Fokusindikatoren hinzu, unterstützt reduzierte Bewegung, skaliert die Typografie reaktionsschnell und stellt detaillierte technische Spezifikationen mit genauen Werten bereit. Quelle: kanopi/cms-cultivator.
Fakten (zitierbereit)
Stabile Felder und Befehle für KI/Such-Zitate.
- Installationsbefehl
npx skills add https://github.com/kanopi/cms-cultivator --skill responsive-styling- Quelle
- kanopi/cms-cultivator
- Kategorie
- </>Entwicklung
- Verifiziert
- ✓
- Erstes Auftreten
- 2026-02-01
- Aktualisiert
- 2026-02-18
Schnelle Antworten
Was ist responsive-styling?
Generieren Sie automatisch responsives CSS/SCSS für Mobilgeräte, wenn Sie Komponentenstile erstellen oder responsives Design erwähnen. Implementiert Standard-Haltepunkte (768 Pixel, 1024 Pixel), stellt den WCAG AA-Farbkontrast sicher, erstellt berührungsfreundliche Schnittstellen (Mindestziele 44 Pixel), fügt geeignete Fokusindikatoren hinzu, unterstützt reduzierte Bewegung, skaliert die Typografie reaktionsschnell und stellt detaillierte technische Spezifikationen mit genauen Werten bereit. Quelle: kanopi/cms-cultivator.
Wie installiere ich responsive-styling?
Öffnen Sie Ihr Terminal oder Kommandozeilen-Tool (Terminal, iTerm, Windows Terminal, etc.) Kopieren Sie diesen Befehl und führen Sie ihn aus: npx skills add https://github.com/kanopi/cms-cultivator --skill responsive-styling Nach der Installation wird der Skill automatisch in Ihrer KI-Programmierumgebung konfiguriert und ist bereit zur Verwendung in Claude Code oder Cursor
Wo ist das Quell-Repository?
https://github.com/kanopi/cms-cultivator
Details
- Kategorie
- </>Entwicklung
- Quelle
- skills.sh
- Erstes Auftreten
- 2026-02-01