Figma naar website: lanceer een landingspagina
Zet een marketingframe van Figma om naar HTML, CSS en JavaScript en publiceer vervolgens de voltooide website.
Zet Figma-ontwerpen om in werkende webapps
Plak een Figma frame-link, beschrijf wat de pagina moet doen, en laat Manus de frontend en backend bouwen die je kunt publiceren.
Van ontwerpframe naar werkende pagina
Manus leest de lay-out, componenten, lettertypen en kleuren in het Figma-frame om een functionele webapp te bouwen.
DesignframeWerkende pagina
Illustratief voorbeeld.
Design naar code voor de pagina's die je nodig hebt
Begin met een landingspagina, een dashboard of meerdere verbonden frames. Elk verzoek kan het gedrag achter het ontwerp beschrijven.
Figma naar code: bouw een werkend dashboard
Deel een ontwerp voor een adminsdashboard en beschrijf de gegevens en acties die je nodig hebt. Manus bouwt een webapp met frontend- en backendcomponenten.
Figma naar app: verbind de hele flow
Breng meerdere frames samen in één design-naar-code-aanvraag. Beschrijf hoe pagina’s zijn gekoppeld, wat er gebeurt bij een klik en welke componentstatussen belangrijk zijn.
Zet Figma om naar code met een link, niet met een plugin
Er is geen aparte Figma-naar-code plugin nodig voor de gedocumenteerde workflow. Verbind je Figma-account, plak een frame-link en vertel wat er op de pagina moet werken.
Publiceer je site en blijf hem daarna verbeteren
AI-ontwerp naar code stopt niet bij een voorbeeld. Publiceer de website, koppel je eigen domein en beschrijf de wijzigingen die je wilt in een gesprek.
Eén link, een duidelijk verzoek, een site die je kunt publiceren
Leg uit hoe je frames met elkaar verbonden zijn. Bekijk vervolgens het resultaat en ga verder met wijzigingen in het gesprek.
Blijf bouwen met Manus
Veelgestelde vragen
Hoe converteer ik Figma naar code met Manus?
Verbind je Figma-account met Manus, deel vervolgens een link naar een Figma-frame en beschrijf de webapp die je wilt bouwen. Manus leest de layout, componenten, lettertypen en kleuren, en bouwt daarna de frontend en de benodigde backend-componenten.
Kan Manus Figma omzetten naar HTML en CSS?
Ja. De gedocumenteerde Figma import genereert HTML, CSS en JavaScript voor de frontend, plus de backend-componenten die nodig zijn voor de gewenste webapp. Standaard bouwt Manus dit als een React en Tailwind CSS project dat als HTML, CSS en JavaScript in de browser draait. Beschrijf de pagina's en het gedrag dat je nodig hebt samen met de frame-link.
Ondersteunt Manus Figma naar React en Figma naar Tailwind?
Ja. Manus bouwt websites standaard met React en Tailwind CSS, dus een ontwerp dat uit Figma wordt geïmporteerd, wordt een React frontend met Tailwind styling, plus de backendcode die je aanvraag nodig heeft. Je kunt de projectcode exporteren naar een privé GitHub repository.
Heb ik een Figma naar code-plugin nodig?
Er is geen aparte plugin onderdeel van de gedocumenteerde flow. Verbind je Figma-account, deel een frame-link met Manus en leg uit wat er gebouwd moet worden; je kunt meer frames toevoegen als je ontwerp meerdere pagina's of statussen heeft.
Moet ik een Figma MCP-server installeren?
Nee. Manus maakt rechtstreeks verbinding met je Figma-account via het inloggen bij Figma. Nadat je het hebt verbonden, importeer je een framelink en beschrijf je de app; er is geen afzonderlijke Figma MCP-server om te installeren of uit te voeren.
Heb ik Figma Dev Mode of een betaalde Figma-plek nodig?
Nee. Manus importeert frames via je verbonden Figma-account in plaats van via Dev Mode, en een gratis Figma-account kan verbinden. Figma beperkt hoe vaak apps bestanden kunnen lezen: gratis abonnementen en plekken zonder Dev Mode krijgen een kleine maandelijkse limiet, terwijl betaalde plekken met Dev Mode veel hogere limieten krijgen. Als je de limiet bereikt, laat Manus dit weten.
Kan een Figma naar code AI-workflow een werkende app bouwen?
Ja. Deel een Figma frame-link en beschrijf de app. Manus analyseert het ontwerp en bouwt de frontend, evenals de nodige backend-componenten voor een werkende webapp.
Kan Manus meerpaginaontwerpen en interacties verwerken?
Ja. Deel meerdere Figma frames en leg de paginaflow, interacties of componentstatussen uit, zoals hover. Dit helpt Manus om een interactieve, meerpagina-webervaring te bouwen.
Kan ik de site publiceren na conversie?
Ja. Bekijk de webapp in de preview, klik op Publiceren en deze wordt online toegankelijk. Je kunt een aangepast domein koppelen en blijven doorgaan met wijzigingen door deze aan Manus te beschrijven.
Hoe verschilt dit van Figma Make?
Figma Make is een product van Figma. Met Manus begint het gedocumenteerde traject met een Figma frame-link en een aanvraag voor een webapp: het kan backend-componenten omvatten, waarna je de site kunt publiceren en in een gesprek verder kunt bewerken.
Kan ik Figma naar Flutter of Figma naar React Native output gebruiken?
Deze pagina behandelt de conversie van Figma naar een webapp. De importhandleiding noemt HTML, CSS en JavaScript voor de frontend; deze bevestigt geen Flutter- of React Native-output.