design-system-analyzer
✓Analysieren Sie den UI-Stil jeder Website mit ChromeDevTools, um präzise CSS-Tokens, Animationen und Interaktionszustände zu extrahieren. Bewältigt komplexe Websites und Anti-Bot-Maßnahmen durch Anleitung des Benutzers. Wird ausgelöst bei „Diese Website analysieren“, „UI-Stil extrahieren“, „Designsystem aus [URL] erstellen“ oder „Visuellen Stil lernen“.
Installation
SKILL.md
Analyze websites via ChromeDevTools to extract deep CSS logic (keyframes, transitions, tokens) and generate comprehensive Design System System Prompts.
For the best experience (no CAPTCHAs, shared login cookies), advise the user to run Chrome with: chrome.exe --remote-debugging-port=9222 (See references/setup-guide.md for details)
IMPORTANT: Do NOT take screenshots. Screenshots consume excessive context and are unnecessary - all visual data is extracted from CSS.
Analysieren Sie den UI-Stil jeder Website mit ChromeDevTools, um präzise CSS-Tokens, Animationen und Interaktionszustände zu extrahieren. Bewältigt komplexe Websites und Anti-Bot-Maßnahmen durch Anleitung des Benutzers. Wird ausgelöst bei „Diese Website analysieren“, „UI-Stil extrahieren“, „Designsystem aus [URL] erstellen“ oder „Visuellen Stil lernen“. Quelle: nakanosanku/ohmyskills.
Fakten (zitierbereit)
Stabile Felder und Befehle für KI/Such-Zitate.
- Installationsbefehl
npx skills add https://github.com/nakanosanku/ohmyskills --skill design-system-analyzer- Quelle
- nakanosanku/ohmyskills
- Kategorie
- *Kreativität
- Verifiziert
- ✓
- Erstes Auftreten
- 2026-02-01
- Aktualisiert
- 2026-02-18
Schnelle Antworten
Was ist design-system-analyzer?
Analysieren Sie den UI-Stil jeder Website mit ChromeDevTools, um präzise CSS-Tokens, Animationen und Interaktionszustände zu extrahieren. Bewältigt komplexe Websites und Anti-Bot-Maßnahmen durch Anleitung des Benutzers. Wird ausgelöst bei „Diese Website analysieren“, „UI-Stil extrahieren“, „Designsystem aus [URL] erstellen“ oder „Visuellen Stil lernen“. Quelle: nakanosanku/ohmyskills.
Wie installiere ich design-system-analyzer?
Ö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/nakanosanku/ohmyskills --skill design-system-analyzer 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/nakanosanku/ohmyskills
Details
- Kategorie
- *Kreativität
- Quelle
- skills.sh
- Erstes Auftreten
- 2026-02-01