·logo-with-variants
*

logo-with-variants

crafter-station/elements

Créez des composants de logo avec plusieurs variantes (icône, mot-symbole, logo) et modes clair/sombre. À utiliser lorsque l'utilisateur fournit des fichiers de logo SVG et souhaite créer un composant de logo basé sur des variantes suivant le modèle Clerk dans le projet Elements.

17Installations·2Tendance·@crafter-station

Installation

$npx skills add https://github.com/crafter-station/elements --skill logo-with-variants

SKILL.md

Creates logo components with variant support following the established pattern in Elements codebase.

Reference implementation: Check src/components/ui/logos/clerk.tsx for the exact pattern to follow.

CRITICAL: The variants array MUST list ALL combinations explicitly in {base}-{mode} format (e.g., "icon-dark", "logo-light"). This is what makes the variant count badge (e.g., "6") appear correctly in the UI. Do NOT just list base names like ["icon", "logo", "wordmark"].

Créez des composants de logo avec plusieurs variantes (icône, mot-symbole, logo) et modes clair/sombre. À utiliser lorsque l'utilisateur fournit des fichiers de logo SVG et souhaite créer un composant de logo basé sur des variantes suivant le modèle Clerk dans le projet Elements. Source : crafter-station/elements.

Voir l'original

Faits (prêts à citer)

Champs et commandes stables pour les citations IA/recherche.

Commande d'installation
npx skills add https://github.com/crafter-station/elements --skill logo-with-variants
Catégorie
*Créativité
Vérifié
Première apparition
2026-02-01
Mis à jour
2026-02-18

Réponses rapides

Qu'est-ce que logo-with-variants ?

Créez des composants de logo avec plusieurs variantes (icône, mot-symbole, logo) et modes clair/sombre. À utiliser lorsque l'utilisateur fournit des fichiers de logo SVG et souhaite créer un composant de logo basé sur des variantes suivant le modèle Clerk dans le projet Elements. Source : crafter-station/elements.

Comment installer logo-with-variants ?

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/crafter-station/elements --skill logo-with-variants 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/crafter-station/elements

Détails

Catégorie
*Créativité
Source
skills.sh
Première apparition
2026-02-01