Arrêtez les hallucinations de l’IA.
Votre éditeur d'IA connaît Tailwind CSS.
Cherry est un serveur MCP (Model Context Protocol) gratuit qui fournit à votre assistant de codage IA les spécifications exactes des composants CSS, les thèmes, les documents et les blocs dont il a besoin – à la demande, sans hallucinations.
Pourquoi les assistants IA se trompent sur Tailwind CSS – et comment Cherry le corrige
Sans cerise
- L'IA hallucine des noms de classes qui n'existent pas dans Frutjam
- Vous copiez-collez des documents dans chaque invite, gaspillant des jetons
- llms.txt vide tout – l'IA est submergée
- Ruptures d'interface utilisateur générées car l'IA utilisait des API de composants obsolètes
Avec Cerise
- L'IA récupère les spécifications exactes de chaque composant dont elle a besoin
- Le bon contexte au bon moment – pas de gaspillage de jetons
- Always in sync with the latest Frutjam version
- Le résultat est précis, sémantique et prêt pour la production
Ce que Cherry peut faire
Décrivez simplement ce que vous voulez. Cherry donne à votre IA les connaissances exactes dont elle a besoin pour la construire correctement.
| Vous demandez à votre IA... | Cherry y parvient |
|---|---|
| "Ajouter une section de tarification à cette page" | Récupère le véritable bloc de tarification HTML et le dépose |
| "Quelles variantes de badges Frutjam propose-t-il ?" | Extrait les spécifications complètes du badge : classes, tailles, états, exemples |
| "Appliquer le thème myrtille à cette mise en page" | Charge les jetons de conception exacts pour ce thème |
| "Convertir cette barre de navigation Bootstrap en Frutjam" | Migre le balisage pour corriger les classes Frutjam |
| "Transformez ce design Figma en Frutjam HTML" | Lit le lien Figma et le reproduit avec les composants Frutjam |
| "Migrez cette simple carte Tailwind vers Frutjam" | Remplace les utilitaires Tailwind par les bonnes classes de composants Frutjam |
Commandes slash AI intégrées
Cherry comprend des invites prêtes à l'emploi pour les tâches Frutjam les plus courantes. Tapez la commande dans votre éditeur IA, fournissez votre contribution et obtenez un code Frutjam précis – aucune invite manuelle n'est nécessaire.
/figma_to_frutjam
Figma → Fruitjam
Collez une description de conception Figma ou un JSON exporté. Cherry le convertit en HTML Frutjam précis et copiable.
/image_to_frutjam
Capture d'écran → Frutjam
Décrivez une capture d'écran de l'interface utilisateur ou partagez l'URL d'une image. Cherry le reproduit avec les composants Frutjam les plus proches.
/tailwind_to_frutjam
Vent arrière → Frutjam
Collez le HTML Tailwind brut. Cherry remplace les utilitaires créés à la main par les classes de composants Frutjam appropriées.
/bootstrap_to_frutjam
Bootstrap → Frutjam
Collez le balisage Bootstrap. Cherry mappe chaque classe Bootstrap à son équivalent Frutjam et génère du HTML propre.
/generate_theme
Générer un thème
Décrivez une ambiance, une marque ou une palette de couleurs. Cherry génère un thème Frutjam complet avec toutes les variables CSS requises.
+
Plus d'invites ajoutées à chaque mise à jour.
Toutes les commandes slash sont disponibles dans Claude Code, Cursor, VS Code et tout éditeur compatible MCP.
Comment Cherry se compare
Tous les contextes d’IA ne sont pas égaux.
| Cherry MCP | llms.txt | No context | |
|---|---|---|---|
| Noms de classe précis | ✓ | Partiel | ✗ |
| À la demande : uniquement ce qui est nécessaire | ✓ | ✗ jette tout | ✗ |
| Jeton efficace | ✓ | ✗ | ✓ |
| Toujours à jour | ✓ | ✓ | ✗ |
| Thèmes et jetons de conception | ✓ | Partiel | ✗ |
| Blocs de pages prêts à l'emploi | ✓ | ✗ | ✗ |
| Figma / image → code | ✓ | ✗ | ✗ |
| Migration du framework | ✓ Vent arrière, Bootstrap | ✗ | ✗ |
| Noms de classe précis Tailwind CSS v4 | ✓ | Partiel | ✗ |
Installation en moins d'une minute
Aucun compte n'est nécessaire pour commencer. Le niveau gratuit fonctionne immédiatement : ajoutez simplement Cherry à votre éditeur et c'est parti. La clé de licence et l'e-mail ne sont requis que pour les forfaits Pro et Team.
Claude Code
Niveau gratuit aucun compte n'est nécessaire
claude mcp add frutjam-cherry -- npx -y frutjam-cherry@latest
Pro / Equipe permis requis
claude mcp add frutjam-cherry \
--env LICENSE=your-license-key \
--env EMAIL=your@email.com \
-- npx -y frutjam-cherry@latest
Cursor
Ouvrez Paramètres du curseur → MCP et ajoutez :
Niveau gratuit aucun compte n'est nécessaire
{
"frutjam-cherry": {
"command": "npx",
"args": ["-y", "frutjam-cherry@latest"]
}
}
Pro / Equipe permis requis
{
"frutjam-cherry": {
"command": "npx",
"args": ["-y", "frutjam-cherry@latest"],
"env": {
"LICENSE": "your-license-key",
"EMAIL": "your@email.com"
}
}
}
VS Code
Appuyez sur Ctrl+Shift+P → MCP : ouvrez la configuration utilisateur, puis ajoutez :
Niveau gratuit aucun compte n'est nécessaire
{
"servers": {
"frutjam-cherry": {
"type": "stdio",
"command": "npx",
"args": ["-y", "frutjam-cherry@latest"]
}
}
}
Pro / Equipe permis requis
{
"servers": {
"frutjam-cherry": {
"type": "stdio",
"command": "npx",
"args": ["-y", "frutjam-cherry@latest"],
"env": {
"LICENSE": "your-license-key",
"EMAIL": "your@email.com"
}
}
}
}
Other editors
Niveau gratuit aucun compte n'est nécessaire
{
"mcpServers": {
"frutjam-cherry": {
"command": "npx",
"args": ["-y", "frutjam-cherry@latest"]
}
}
}
Pro / Equipe permis requis
{
"mcpServers": {
"frutjam-cherry": {
"command": "npx",
"args": ["-y", "frutjam-cherry@latest"],
"env": {
"LICENSE": "your-license-key",
"EMAIL": "your@email.com"
}
}
}
}
Après la configuration : vos 60 premières secondes
Trois étapes pour confirmer que Cherry fonctionne et commencer la construction.
Vérifiez qu'il fonctionne
VS Code
Ctrl+Maj+U → sélectionnez MCP dans la liste déroulante Sortie. Recherchez frutjam-cherry : Running.
Cursor
Paramètres → MCP. Le serveur doit afficher un statut de connexion vert à côté de frutjam-cherry.
Claude Code
Exécutez claude mcp list dans le terminal. frutjam-cherry devrait apparaître comme connecté.
Exécutez votre premier test
Ouvrez votre panneau de discussion AI et tapez :
List all available Frutjam components
Si Cherry est actif, votre IA appellera list_components et renverra une liste de noms de composants. Ça y est, ça marche.
Commencer la construction – exemples d'invites
| Dis ceci à ton IA | Ce que fait Cherry |
|---|---|
| "Show me how to use the Frutjam button component" | Appelle get_component et renvoie la spécification complète |
| "Build me a pricing card using Frutjam" | Recherche le composant de la carte et écrit un code précis |
| "Show me the darkberry theme tokens" | Appelle get_theme et renvoie toutes les variables CSS |
| "Get me the hero block" | Appelle get_block et renvoie du code HTML copié-collé |
| "How do I install Frutjam?" | Appelle get_docs et renvoie le guide d'installation |
Vous n'avez pas besoin de mentionner Cherry, décrivez simplement ce que vous voulez. Votre IA appelle automatiquement le bon outil.
Cherry est inclus dans Pro et Team
Niveau gratuit disponible – demandes quotidiennes limitées, aucun compte requis.
Passez à Pro ou Team pour des requêtes illimitées et un accès aux blocs premium et aux commandes AI slash.
FAQ
Qu'est-ce qu'un serveur MCP ?
MCP (Model Context Protocol) est un standard ouvert qui permet aux assistants IA d'appeler des outils externes au moment de l'exécution. Cherry agit comme un serveur d'outils : votre éditeur d'IA l'appelle pour récupérer les spécifications Frutjam à la demande, au lieu de deviner à partir des données d'entraînement.
Pourquoi les assistants IA hallucinent-ils les noms de classes CSS Tailwind ?
Les modèles d'IA sont formés sur un instantané du Web : ils ne connaissent pas les noms exacts des classes de votre bibliothèque de composants spécifique, en particulier pour les bibliothèques les plus récentes ou les API Tailwind CSS v4. Sans contexte réel, ils inventent des cours plausibles mais inexistants. Cherry résout ce problème en fournissant à votre IA les documents réels et à jour des composants Frutjam au moment où elle en a besoin, éliminant ainsi complètement les hallucinations.
Quels éditeurs Cherry prend-il en charge ?
Tout éditeur prenant en charge MCP : Claude Code, Cursor, VS Code, Windsurf, Zed, Cline et tout autre éditeur implémentant le standard MCP.
Quelle est la différence entre gratuit et Pro/Team ?
Free vous offre des requêtes quotidiennes limitées et un accès aux documents de composants et aux blocs gratuits. Pro et Team débloquent des requêtes illimitées, des blocs premium, des modèles et toutes les commandes slash de l'IA.
Comment puis-je recevoir ma clé de licence ?
Votre clé de licence est envoyée par e-mail immédiatement après votre inscription. Vous pouvez également gérer votre abonnement et vos sièges à partir du tableau de bord de votre compte.
Puis-je utiliser Cherry hors ligne ?
Cherry valide votre licence en ligne lors de la première utilisation, puis la met en cache localement pendant 7 jours. Après cela, il est revalidé. Une courte connexion Internet suffit.
Puis-je annuler à tout moment ?
Oui. Annulez à tout moment. Votre accès continue jusqu'à la fin de la période de facturation.
Prêt à construire plus rapidement ?
Faites fonctionner votre IA avec un code Frutjam précis dès la première invite.