Aus dem freigegebenen Layout wird eine funktionierende Ausgabe.
Wähle einen Frame und übertrage Layout, Constraints, Komponenten und responsive Logik in React, HTML/CSS oder Vue.
Freigegebener Frame
export function Card() {
return (
<article className="card">
<h2>Made to move.</h2>
</article>
);
}Die Implementierung beginnt beim Designsystem.
Die Ausgabe folgt der freigegebenen Struktur, statt jemanden aufzufordern, die Seite anhand eines Screenshots nachzubauen.
- 01
Frame auswählen
Übertrage Abstände, Richtung und responsive Regeln in das Zielformat.
- 02
Stack auswählen
Dieselbe freigegebene Quelle für React-, HTML/CSS- und Vue-Projekte; Dev Mode ergänzt Snippets pro Ebene für SwiftUI, Jetpack Compose und mehr.
- 03
Produkt verbinden
Prüfe das Ergebnis und verknüpfe es vor der Veröffentlichung mit echten Daten und Funktionen.
Wähle das Format, das dein Produkt braucht.
Dieselbe freigegebene Quelle für React-, HTML/CSS- und Vue-Projekte; Dev Mode ergänzt Snippets pro Ebene für SwiftUI, Jetpack Compose und mehr.
01export function CheckoutCard({ plan }) {02 return <article className="checkout-card">03 <PlanSummary plan={plan} />04 <CheckoutAction />05 </article>06}Eine klare Brücke statt eines magischen Release-Buttons.
- 01Beginnt mit einem freigegebenen Frame
- 02Überträgt Layout und Constraints
- 03Hält die Komponentenstruktur sichtbar
- 04Erfordert eine Produktprüfung vor der Veröffentlichung
Starte mit einem Layout, das du kennst.
Öffne eine leere Arbeitsfläche oder bringe eine eigene .fig-Datei mit.