design-system-analyzer
✓Analysez le style d'interface utilisateur de n'importe quel site Web à l'aide de ChromeDevTools pour extraire des jetons CSS, des animations et des états d'interaction précis. Gère les sites complexes et les mesures anti-bot en guidant l'utilisateur. Déclencheurs sur "analyser ce site", "extraire le style de l'interface utilisateur", "créer un système de conception à partir de [URL]" ou "apprendre le style visuel".
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.
Analysez le style d'interface utilisateur de n'importe quel site Web à l'aide de ChromeDevTools pour extraire des jetons CSS, des animations et des états d'interaction précis. Gère les sites complexes et les mesures anti-bot en guidant l'utilisateur. Déclencheurs sur "analyser ce site", "extraire le style de l'interface utilisateur", "créer un système de conception à partir de [URL]" ou "apprendre le style visuel". Source : nakanosanku/ohmyskills.
Faits (prêts à citer)
Champs et commandes stables pour les citations IA/recherche.
- Commande d'installation
npx skills add https://github.com/nakanosanku/ohmyskills --skill design-system-analyzer- Source
- nakanosanku/ohmyskills
- Catégorie
- *Créativité
- Vérifié
- ✓
- Première apparition
- 2026-02-01
- Mis à jour
- 2026-02-18
Réponses rapides
Qu'est-ce que design-system-analyzer ?
Analysez le style d'interface utilisateur de n'importe quel site Web à l'aide de ChromeDevTools pour extraire des jetons CSS, des animations et des états d'interaction précis. Gère les sites complexes et les mesures anti-bot en guidant l'utilisateur. Déclencheurs sur "analyser ce site", "extraire le style de l'interface utilisateur", "créer un système de conception à partir de [URL]" ou "apprendre le style visuel". Source : nakanosanku/ohmyskills.
Comment installer design-system-analyzer ?
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/nakanosanku/ohmyskills --skill design-system-analyzer 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/nakanosanku/ohmyskills
Détails
- Catégorie
- *Créativité
- Source
- skills.sh
- Première apparition
- 2026-02-01