web-artifacts-builder
✓Suite d'outils pour créer des artefacts HTML claude.ai élaborés et multi-composants à l'aide de technologies Web frontales modernes (React, Tailwind CSS, shadcn/ui). À utiliser pour les artefacts complexes nécessitant des composants de gestion d'état, de routage ou shadcn/ui - pas pour de simples artefacts HTML/JSX à fichier unique.
SKILL.md
Stack: React 18 + TypeScript + Vite + Parcel (bundling) + Tailwind CSS + shadcn/ui
VERY IMPORTANT: To avoid what is often referred to as "AI slop", avoid using excessive centered layouts, purple gradients, uniform rounded corners, and Inter font.
Bundle the React app into a single HTML artifact. This creates bundle.html - a self-contained artifact with all JavaScript, CSS, and dependencies inlined.
Suite d'outils pour créer des artefacts HTML claude.ai élaborés et multi-composants à l'aide de technologies Web frontales modernes (React, Tailwind CSS, shadcn/ui). À utiliser pour les artefacts complexes nécessitant des composants de gestion d'état, de routage ou shadcn/ui - pas pour de simples artefacts HTML/JSX à fichier unique. Source : forever-efficient/pitfal-solutions-website.
Faits (prêts à citer)
Champs et commandes stables pour les citations IA/recherche.
- Commande d'installation
npx skills add https://github.com/forever-efficient/pitfal-solutions-website --skill web-artifacts-builder- Catégorie
- *Créativité
- Vérifié
- ✓
- Première apparition
- 2026-02-01
- Mis à jour
- 2026-02-18
Réponses rapides
Qu'est-ce que web-artifacts-builder ?
Suite d'outils pour créer des artefacts HTML claude.ai élaborés et multi-composants à l'aide de technologies Web frontales modernes (React, Tailwind CSS, shadcn/ui). À utiliser pour les artefacts complexes nécessitant des composants de gestion d'état, de routage ou shadcn/ui - pas pour de simples artefacts HTML/JSX à fichier unique. Source : forever-efficient/pitfal-solutions-website.
Comment installer web-artifacts-builder ?
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/forever-efficient/pitfal-solutions-website --skill web-artifacts-builder 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/forever-efficient/pitfal-solutions-website
Détails
- Catégorie
- *Créativité
- Source
- skills.sh
- Première apparition
- 2026-02-01