PRÉSENTATION
Locofy (écrit aussi Locofy.ai) est un outil qui transforme des maquettes d’interface en code. Vous dessinez dans Figma, Penpot ou Adobe XD, vous balisez les éléments interactifs avec le plugin de Locofy, puis ses modèles maison, les Large Design Models, produisent le code pour React, React Native, HTML et CSS, Flutter, Next.js, Angular, Vue ou Gatsby. Un aperçu s’affiche pendant la conversion, et le code s’exporte en archive, vers GitHub ou vers l’extension VS Code.
Locofy s’adresse aux développeurs front-end et aux designers qui veulent éviter de recoder à la main chaque écran. Le site met aussi en avant un serveur MCP qui relie le code généré à des assistants de programmation comme Cursor, GitHub Copilot, Windsurf (devenu Devin Desktop) ou Claude Desktop. L’outil vise surtout les équipes et les entreprises : la page d’accueil évoque des options de cloud privé et d’hébergement sur site.
La limite principale est le prix : l’ancienne bêta gratuite a disparu, et la page de tarifs propose un essai gratuit de 7 jours, puis une formule Hobby à 40 $ par mois et une formule Pro à 80 $ par mois (relevé du 10 novembre 2026). Le code généré reste à relire et à tester avant la production, et la qualité dépend de la propreté de la maquette.
Créez avec Higgsfield
Générez des influenceurs IA, des jeux vidéo ou des vidéos 4K en moins de 3 clics.
- Influenceur IA
- Jeux vidéo
- Vidéo 4K
Convertir Figma en code
La page Figma vers React explique la marche à suivre en trois étapes : Design in Figma, Real-time Preview, puis Get React Code. Le plugin s’installe dans Figma, avec des versions pour Penpot et Adobe XD. Locofy génère du code par composants et permet d’ajouter du contenu dynamique grâce à la liaison de données avec une API. Des pages équivalentes existent pour HTML/CSS, Vue, Next.js, Gatsby, React Native et Angular. La FAQ de la page de tarifs recommande des maquettes bien structurées : calques regroupés et nommés, Auto Layout dans Figma, pour obtenir un meilleur code.
MCP et assistants de code
La page Locofy MCP décrit un serveur MCP qui permet de reprendre le code généré par Locofy et de le modifier avec des consignes écrites, dans Gemini CLI, Cursor, GitHub Copilot, Windsurf (devenu Devin Desktop) ou Claude Desktop. L’accueil présente aussi le Locofy Agent Mode, une zone de saisie où l’on demande par exemple d’ajouter des interactions à l’interface, et l’extension VS Code pour récupérer le code dans l’éditeur. Le code se pousse aussi vers un dépôt avec l’intégration GitHub, ou se télécharge. Le MCP figure dans les formules Hobby et Pro de la page de tarifs.
Formules et LDMtokens
La page Pricing compte en LDMtokens : ce sont les crédits de Locofy, consommés à chaque conversion de maquette en code. La formule Free donne 2 000 LDMtokens et toutes les fonctions de Hobby pendant 7 jours, puis bascule sur Hobby. Hobby (40 $ par mois) garde 2 000 LDMtokens, une conversion d’écran à la fois et 10 écrans par projet. Pro (80 $ par mois) passe à 4 000 LDMtokens et 25 écrans par projet, et précise que votre contenu ne sert jamais à entraîner la plateforme. Enterprise est sur devis. Le détail est repris plus bas, avec la date du relevé.
LES POUR :
-
Figma, Penpot et Adobe XD
-
Nombreux frameworks front
-
MCP pour Cursor et Claude
-
Aperçu en temps réel
-
Export, GitHub et VS Code
LES CONTRES :
-
Payant après 7 jours
-
Interface en anglais
-
Maquettes bien structurées requises
-
Une conversion à la fois
Combien coûte Locofy ?
Locofy ne propose plus la bêta gratuite d’autrefois. Voici les formules de la page de tarifs officielle, relevées le 10 novembre 2026. Les prix sont en dollars américains, taxes non précisées.
| Formule | Prix | LDMtokens | Ce qui est indiqué |
|---|---|---|---|
| Free | 0 $ | 2 000 | Fonctions de Hobby pendant 7 jours, puis passage automatique à Hobby |
| Hobby | 40 $ par mois, facturé au mois | 2 000 | Usage individuel, 1 conversion à la fois, 10 écrans par projet, MCP ; votre contenu peut servir à améliorer la plateforme |
| Pro | 80 $ par mois, facturé au mois | 4 000 | 25 écrans par projet, compte UIPro Pro offert, contenu jamais utilisé pour l’entraînement |
| Enterprise | Sur devis | Sur mesure | Équipes illimitées, GitHub, cloud privé ou hébergement sur site, facturation annuelle |
À savoir. D’après la FAQ, la facturation annuelle n’existe que pour Enterprise. Vous pouvez résilier à tout moment depuis le tableau de bord, et acheter des LDMtokens supplémentaires en changeant de formule.
Convertissez votre maquette en code
Locofy lit vos maquettes Figma, Penpot ou Adobe XD et produit du code pour votre framework.
- Plugin Figma
- React, Next.js, Flutter
- MCP pour assistants de code
À qui s’adresse Locofy ?
Locofy figure parmi nos outils IA de développement. Il convient surtout à ces profils :
- Développeurs front-end. Ils reçoivent du code par composants au lieu de partir d’une page vide.
- Designers qui travaillent dans Figma. Le plugin s’utilise dans leur outil habituel.
- Équipes produit. Un aperçu en direct sert à valider l’interface avant la mise en production.
- Utilisateurs d’assistants de code. Le MCP relie le code Locofy à Cursor ou Claude. Voir notre sélection des meilleurs outils IA pour coder.
Comment débuter avec Locofy ?
Étape 1 : Créez votre compte
Sur locofy.ai, cliquez sur Get Started. Le plan Free démarre avec 2 000 LDMtokens.
Étape 2 : Installez le plugin
Ajoutez le plugin Locofy à Figma, Penpot ou Adobe XD. Les boutons de l’accueil renvoient vers l’installation.
Étape 3 : Préparez la maquette
Regroupez et nommez vos calques, utilisez Auto Layout, puis marquez les boutons, champs et autres éléments interactifs.
Étape 4 : Lancez la conversion
Choisissez votre framework, par exemple React ou Next.js, et regardez l’aperçu en temps réel. Vous pouvez corriger les choix de LocoAI avant l’export.
Étape 5 : Récupérez le code
Exportez en archive, poussez vers GitHub ou ouvrez le code dans VS Code. Relisez et testez avant toute mise en production.
Quelles sont les alternatives à Locofy ?
Ces outils servent aussi à produire une interface, souvent à partir d’un texte plutôt que d’une maquette. Leurs prix proviennent de leurs fiches du site, relevés le 10 novembre 2026 sur les pages officielles.
| Outil | Première formule payante | Offre gratuite | Sur AI Explorer |
|---|---|---|---|
| v0 | Plus : 30 $ par utilisateur et par mois | Free : 7 messages par jour | Fiche v0 |
| Bolt.new | Pro : 25 $ par mois, 18 $ en annuel | Free : 300 000 jetons par jour | Fiche Bolt.new |
| Cursor | Plus : 8 $ par mois | Formule gratuite limitée | Fiche Cursor |
| GitHub Copilot | Pro : 10 USD par mois | Free : 0 USD | Fiche GitHub Copilot |
Chacun part d’un point de départ différent (description écrite, éditeur de code, import de maquette) : consultez leurs fiches avant de choisir.
Questions fréquentes sur Locofy
Locofy est-il gratuit ?
Partiellement. La formule Free donne 2 000 LDMtokens et les fonctions de Hobby pendant 7 jours, puis bascule automatiquement sur Hobby à 40 $ par mois.
Que sont les LDMtokens ?
D’après la FAQ officielle, ce sont les crédits de Locofy : ils s’ajoutent à votre compte avec la formule choisie et se consomment à chaque conversion d’une maquette en code. Vous pouvez en acheter d’autres en changeant de formule.
Locofy fonctionne-t-il avec n’importe quelle maquette ?
Oui, selon la FAQ, mais le résultat est meilleur avec une maquette bien structurée : calques groupés, noms clairs, Auto Layout dans Figma. Relisez le code généré avant de l’utiliser en production.
Locofy est-il disponible en français ?
Non. Le site, la page de tarifs et la documentation sont en anglais, sans sélecteur de langue.
Mes maquettes servent-elles à entraîner l’IA ?
Sur la page de tarifs, la formule Hobby indique que votre contenu peut servir à améliorer la plateforme, alors que Pro précise qu’il n’est jamais utilisé pour entraîner ou améliorer la plateforme. Lisez les conditions et la politique de confidentialité avant d’envoyer des maquettes confidentielles.
Sources
Pages officielles consultées le 10 novembre 2026.