Figma-Alternativen für Designer, die HTML liefern
Die meisten Figma-Alternativen kopieren den Canvas. Einige ändern, woraus der Canvas besteht. So schneiden die wichtigsten Optionen ab, wenn deine Designs am Ende Websites werden.
Warum Leute eine Figma-Alternative suchen
Die Gründe, die wir am häufigsten hören, sind einfach: eine Open-Source-Lizenz, Dateien, die auf dem eigenen Rechner bleiben, ein kostenloser Tarif ohne Limits, die wirklich stören, oder ein Workflow, der näher am Code ist.
Der letzte Grund ist der, warum es diesen Artikel gibt. In den meisten Designtools ist der Canvas eine Vektorzeichnung. Ein Browser bekommt ihn nie zu sehen. Jemand muss trotzdem jeden Frame in HTML und CSS nachbauen und reparieren, was unterwegs verloren gegangen ist.
Die Kurzfassung
| Tool | Open Source | Wie du designst | Agenten und MCP | Wo die Dateien liegen |
|---|---|---|---|---|
| Figma | Nein | Vektor-Canvas | MCP-Server, Schreiben auf den Canvas in der Beta | Figmas Cloud |
| Penpot | Ja | Canvas mit CSS-Flex- und Grid-Layouts | Offener MCP-Server | Penpot-Cloud oder selbst gehostet |
| Paper | Keine Lizenz veröffentlicht | Canvas aus HTML und CSS | MCP, 100 Tool-Aufrufe pro Woche im Gratis-Tarif | Paper-Workspace, Web- und Desktop-Apps |
| OpenDesign | Ja, Apache-2.0 | Prompt zuerst, ein Agent schreibt HTML-Prototypen | Funktioniert mit Coding-Agenten | Lokaler Ordner |
| Kalka | Ja, MIT | Canvas wie in Figma, jede Ebene ist HTML | Integrierter lokaler MCP, ohne Nutzungslimit | Lokaler Ordner, Git |
Penpot
Penpot ist die bekannteste Open-Source-Alternative. Es läuft im Browser, du kannst es selbst hosten, und der kostenlose Tarif bietet unbegrenzt viele Dateien und Seats. Die Layouts folgen CSS Flex und Grid, und der Inspect-Tab liefert Code in SVG, CSS und HTML. Außerdem gibt es einen offenen MCP-Server, und Figma-Dateien holst du über den Penpot Exporter herein.
Nimm es, wenn du ein ausgereiftes Open-Source-Tool willst, das dein ganzes Team schon heute nutzen kann, mit Self-Hosting.
Paper
Paper kommt der Idee von Kalka am nächsten: Der Canvas ist HTML und CSS, und Agenten lesen und schreiben darauf per MCP. Es gibt Web- und Desktop-Apps, Tokens und Komponenten werden mit einer Codebase synchronisiert, und es exportiert HTML und CSS. Der Gratis-Tarif umfasst 100 MCP-Tool-Aufrufe pro Woche. Pro kostet $16 pro Editor und Monat bei jährlicher Abrechnung ($20 monatlich) und hebt das Limit auf eine Million an.
Nimm es, wenn du jetzt einen HTML-Canvas willst, mit einem finanzierten Team dahinter, und dich ein proprietäres, gehostetes Tool nicht stört.
OpenDesign
OpenDesign ist Open Source (Apache-2.0) und funktioniert anders: Du wählst ein Designsystem, beschreibst deine Screens, und ein Coding-Agent wie Claude Code, Codex oder Cursor schreibt einen HTML-Prototyp. Danach kannst du Elemente verschieben, skalieren und umfärben. Projekte sind HTML- und CSS-Dateien in einem lokalen Ordner. Die Desktop-App ist mit deinem eigenen API-Key kostenlos, bezahlte Tarife bringen gehostete Modell-Credits mit.
Nimm es, wenn du lieber mit einem Prompt startest als mit einem leeren Canvas.
Kalka
Kalka ist das Tool, das wir bauen. Es behält das Interface, das du aus Figma kennst, aber jeder Frame, jede Ebene und jeder Schatten auf dem Canvas ist ein echtes HTML-Element mit echtem CSS, vom Browser gelayoutet. Dein Projekt ist ein normaler Ordner, den du in jedem Code-Editor öffnen und mit Git versionieren kannst. Ein integrierter MCP-Server lässt jeden Agenten auf dem Canvas lesen und zeichnen, lokal und ohne Nutzungslimit. Deine Arbeit nimmst du mit: Kalka importiert .fig- und .pen-Dateien.
Kalka ist in Entwicklung und Open Source unter der MIT-Lizenz. Wir teilen jeden Schritt auf X, während wir es bauen.
Nimm es, wenn du von Hand designen willst, so wie du es schon tust, und dir den Nachbau im Code sparen möchtest.
So entscheidest du
- Du brauchst heute etwas Stabiles und Open Source: Penpot.
- Du willst heute einen HTML-Canvas und brauchst kein Open Source: Paper.
- Du promptest lieber, als zu zeichnen: OpenDesign.
- Du willst Figmas Gewohnheiten, echtes HTML darunter und Dateien, die dir gehören: trag dich in die Kalka-Warteliste ein.