Claude Design ist ein Werkzeug von Anthropic Labs, das aus einem Gespräch editierbare visuelle Arbeit macht: Prototypen, Slide-Decks, One-Pager, Mockups, Landing-Page-Konzepte. Du beschreibst, was du willst, Claude baut eine erste Version, die du sofort siehst, und du verfeinerst sie per Reden, per Kommentar, per Ziehen von Elementen oder mit Reglern, die Claude für dich baut. Wenn es fertig ist, schickst du es zu Canva, Adobe, Figma, PowerPoint, PDF oder direkt in Code.
Es startete am 17. April 2026 und überschritt in der ersten Woche nach dem Juni-Update eine Million Nutzer. Ich führe ein Design- und KI-Studio auf Mallorca, und nach jedem Update kam binnen Tagen von einem Kunden dieselbe Frage in irgendeiner Form: sollten wir das nutzen? Die ehrliche Antwort ist ja, für bestimmte Aufgaben, und nein als Ersatz für die Dinge, die bei dir schon funktionieren. Das ist der Leitfaden, den ich mir selbst gewünscht hätte, geschrieben aus echter Arbeit damit, nicht aus dem Ankündigungs-Post.
Drei Dinge, die man "Claude Design" nennt
Die meiste Verwirrung im Netz kommt daher, dass ein Wort drei verschiedene Dinge meint. Sie hängen zusammen, aber das richtige für die jeweilige Aufgabe zu nehmen ist das ganze Spiel.
Das erste ist Claude Design, das Produkt. Eine eigene Oberfläche, mit eigener Web-Adresse und einem Panel in der Claude Desktop App, wo Claude Designs live neben deinem Chat rendert. Es schreibt das darunterliegende HTML und CSS, also ist das, was du siehst, echt und kein flaches Bild. Das meinen die Leute, wenn sie "Claude Design" sagen.
Das zweite sind die Creative Connectors. Eigenständige Integrationen, die echte Design-Werkzeuge in jedes Claude-Gespräch holen. Der Adobe for creativity Connector bringt über 50 Werkzeuge aus Photoshop, Illustrator, Lightroom, InDesign, Express, Premiere und Firefly mit. Es gibt auch Connectors für Canva und Figma. Damit kann Claude deine Fotos bearbeiten, ein Adobe Express Dokument bauen oder eine Figma-Datei lesen, ohne dass du eine dieser Apps öffnest.
Das dritte ist Claude Code, das Terminal- und Editor-Werkzeug, das echten Produktionscode schreibt und ausliefert. Hier wird aus einem Design eine echte Website. Das ist eine andere Aufgabe als die ersten beiden, und die Grenze zwischen ihnen ist wichtiger, als man denkt.
Wenn dir jemand sagt "Claude hat mein Design-Tool ersetzt", frag, welches der drei er meint. Meistens ist es das erste.
Was Claude Design wirklich erstellen kann
Die beste Eignung ist alles, was überwiegend visuell und in sich geschlossen ist: Pitch-Decks und Präsentationen, exportiert nach PowerPoint oder geschickt zu Canva, One-Pager und Leave-Behinds, Produkt-Mockups und Wireframes, Landing-Page-Konzepte, die du sehen willst, bevor jemand Code schreibt, E-Mail-Vorlagen als sauberes HTML, und Dashboards. Weil es darunter echten Code rendert, kann es auch Dinge, die ein Slide-Tool nicht kann, etwa Prototypen mit Bewegung, Video oder 3D. Das ist nützlich, um eine Idee zu zeigen, weniger nützlich, wenn du eine fertige, druckbare Datei brauchst.
Wie es in der Praxis funktioniert
Die Schleife heißt beschreiben, verfeinern, exportieren.
Du startest aus einem Text-Prompt, oder du lädst Dokumente hoch (Word, PowerPoint, Excel), oder du zeigst Claude deine Live-Website mit einem Capture-Werkzeug, damit das Mockup wie dein echtes Produkt aussieht. Claude erzeugt einen ersten Wurf. Dann verfeinerst du ihn im normalen Gespräch, per Inline-Kommentar am Design, per Ziehen und Skalieren von Elementen auf der Fläche, oder mit Reglern, die Claude für Dinge wie Abstand und Farbe erzeugt.
Was sich für Teams auszahlt, ist das Design-System. Beim Einrichten liest Claude deine Codebase und deine bestehenden Design-Dateien und lernt deine Farben, Schriften und Komponenten. Danach kommt jedes Projekt von Haus aus markengerecht heraus. Das Juni-Update ging weiter. Du kannst ein Design-System aus einem GitHub-Repo oder hochgeladenen Dateien importieren, und Claude prüft seinen eigenen Output gegen dieses System und korrigiert sich, bevor du es überhaupt siehst. Größere Teams können ein einziges freigegebenes System sperren, damit nichts außerhalb der Marke entsteht.
Wenn du fertig bist, exportierst du. Zum Start hieß das Canva, PDF, PowerPoint, HTML oder ein teilbarer interner Link. Seit Mitte Juni schickt es Arbeit auch zu Adobe, Figma, Miro, Gamma, Vercel, Wix, Replit und mehr, plus ein Ein-Klick-Weg in Adobe Experience Manager und Journey Optimizer für Teams, die über Adobe publizieren.
Wo du es einsetzt, und wo nicht
Das ist der Abschnitt, der wirklich Geld spart. Die Falle ist, Claude Design als Werkzeug zu behandeln, das alles ersetzt. Tut es nicht. Es ist ein Werkzeug im Stapel, und die Kunst ist zu wissen, welche Aufgabe wohin gehört.
| Aufgabe | Womit | Warum |
|---|---|---|
| Internes Pitch-Deck oder One-Pager | Claude Design | Markengerechter Entwurf in Minuten, Export nach PPTX oder Canva |
| Landing-Page-Konzept vor dem Bau | Claude Design, dann Claude Code | Sehen, sich einigen, dann echt bauen |
| Ein Flyer oder Menü, das ein Kunde später editiert | Claude Design zu Canva | Der Kunde besitzt und bearbeitet die Datei danach |
| Tägliche Social Posts und Carousels | Dein bestehendes Tool | Was schon funktioniert, reißt du nicht raus |
| Neue Hero- oder generierte Bilder | Ein dediziertes Bildmodell | Der Connector im Chat bearbeitet Fotos, er generiert keine |
| Foto-Cleanup, Hintergrund entfernen, Logo vektorisieren | Adobe Connector in Claude | Profi-Edits, ohne Photoshop zu öffnen |
| Die echte Produktiv-Website | Claude Code | Echtes Repo, echter Build, echtes Deploy |
| Marken-Quelle der Wahrheit, komplexe App-UI | Figma | Bleibt das System of Record für ernstes Produktdesign |
Das Muster: nutze Claude Design, um Dinge zu starten und zu erkunden, nutze deine Spezial-Werkzeuge für die Arbeit, in der sie schon gut sind, und nutze Code für alles, was als echtes Produkt ausgeliefert werden muss.
Was es besser kann als ein normaler Claude-Chat, und wann du es weglässt
Wenn du schon mit Claude im Chat oder in Claude Code arbeitest, lohnt sich hier Klarheit.
Claude Design schlägt einen reinen Chat, wenn du die Sache visuell sehen und formen musst. Im Chat beschreibst du ein Layout und bekommst eine Beschreibung zurück, oder eine Wand aus Code. In Claude Design bekommst du eine Fläche, auf die du zeigen, ziehen und justieren kannst, ohne eine einzige Zeile HTML zu lesen. Es ist für den Moment gebaut, in dem der Output eine Design-Datei sein muss, die jemand anderes öffnen und bearbeiten kann, vor allem jemand, der nicht programmiert. Das ist der eigentliche Hebel. Es gibt Nicht-Designern einen Weg, ordentliche visuelle Arbeit zu produzieren, und Designern einen Weg, zehn Richtungen in der Zeit zu erkunden, die früher eine brauchte.
Du solltest es weglassen und direkt zu Claude Code gehen, wenn das Ziel Produktion ist. Wenn das, was du baust, eine Website oder App ist, die in einer echten Codebase lebt, ist eine Design-Datei ein Umweg. Wir bauen Kundenseiten direkt im Code mit Claude, fahren die Tests und deployen. Es gibt keinen Umweg über ein Design-Tool, weil der Code das Produkt ist.
Der interessante Fall ist die Übergabe zwischen beiden, die Anthropic im Juni ausgeliefert hat. Du kannst eine Seite in Claude Design erkunden und dann das Ganze an Claude Code übergeben, das genau dort weitermacht, wo du aufgehört hast, ohne Screenshot und ohne Neuaufbau von null. Für alle, die Design und Entwicklung machen, ist diese Nahtstelle die eigentliche Schlagzeile. Sie sorgt dafür, dass "lass es mich erst sehen" und "jetzt bau es echt" keine zwei getrennten Welten mehr sind.
Eine ehrliche Anmerkung für Einzelkämpfer und sehr kleine Teams. Viel von der veröffentlichten Kosten-Nutzen-Rechnung nimmt ein Acht-Personen-Team an, das Design- und Entwicklerstunden spart. Wenn du eine Person bist, überträgt sich diese Rechnung nicht. Was sich überträgt, ist die Routing-Logik. Zu wissen, welche Aufgabe in welches Werkzeug gehört, ist mehr wert als jedes Abo, das du dazunimmst.
Die Connectors, kurz
Selbst wenn du das Claude Design Produkt nie öffnest, lohnt es sich, die Connectors zu kennen, denn sie funktionieren innerhalb eines normalen Claude-Gesprächs.
Der Adobe Connector ist der stärkste. Mit einem verbundenen Adobe-Konto kann Claude ein editierbares Adobe Express Dokument aus einer Beschreibung bauen, echte Foto-Edits fahren (Licht und Farbe justieren, Hintergrund entfernen oder weichzeichnen, zuschneiden, ein Logo zu sauberem SVG vektorisieren, die Fläche erweitern), Dokumente in InDesign setzen und Video schneiden und säubern. Was er hier nicht kann, ist brandneue Bilder aus einem Prompt generieren, einen Hintergrund per Beschreibung ersetzen oder hochskalieren. Das braucht weiter die vollen Apps. Denk also an professionelle Bearbeitung auf Abruf, nicht an einen Bildgenerator.
Der Canva Connector macht aus einem Claude-Design eine voll editierbare Canva-Datei, was der sauberste Weg ist, jemandem etwas zu übergeben, der in Canva lebt. Die Figma-Integration ist überwiegend eine Brücke. Sie liest Design-Dateien und macht Code daraus, und sie kann gebaute Oberflächen zurück in editierbare Figma-Frames verwandeln. Wenn dein Figma-Sitz nur Ansicht ist, behandle ihn als Einbahnstraße in den Code, nicht als Ort zum Designen.
Ehrliche Grenzen
Es ist noch eine Research-Preview, und das merkt man. Modell, Editor und Export-Liste haben sich in zwei Monaten zweimal geändert, also hat alles, was du darüber liest, eine kurze Haltbarkeit, Teile dieses Leitfadens eingeschlossen. Live-Designs zu erzeugen verbraucht mehr Tokens als Chatten, und selbst nach der Juni-Effizienzarbeit frisst starke Nutzung in dein Kontingent. Alles, was du in ein statisches Format wie PDF oder ein Express-Dokument exportierst, verliert Bewegung und Interaktivität, weil diese Formate auf ein einziges Bild flachklopfen. Und die Design-System-Magie ist nur so gut wie das System, das du ihr fütterst, was einen Nachmittag Einrichtung bedeutet, bevor der Output wirklich markengerecht ist.
Nichts davon ist ein Ausschlusskriterium. Es sind die normalen Kosten dafür, etwas Neues und schnell Bewegtes zu nutzen, und es lohnt sich, sie zu kennen, bevor du einen Workflow darauf baust.
Das größere Bild
Tritt einen Schritt zurück, und die Strategie ist klar. Anthropic versucht nicht, durch die beste Fläche zu gewinnen. Es positioniert Claude Design als den Ort, wo visuelle Arbeit beginnt, und verbindet es dann mit überall, wohin diese Arbeit muss: Canva, Adobe, Figma, deine Codebase, dein Content-System. Das Design-System, das du importierst, ist dieselbe Komponenten-Bibliothek, mit der Claude Code baut. Ein Modell, das du in einem Claude-Werkzeug skizzierst, kann in ein Deck in einem anderen fließen und raus nach PowerPoint. Für ein kleines Unternehmen ist die praktische Version einfach. Die Markenassets, die du machst, können dorthin wandern, wo dein Team schon arbeitet, und das Konzept, das du visuell erkundest, kann eine echte Website werden, ohne von vorn anzufangen. Wenn du das größere Claude-Bild willst, haben wir das ganze Ökosystem in unserem Claude-Leitfaden 2026 kartiert.
Das ist der Teil, den ich wirklich nützlich finde. Nicht "KI ersetzt Designer", sondern dass der Abstand zwischen einer Idee und einer ausgelieferten Sache deutlich kleiner wird.
FAQ
Was ist Claude Design? Ein Werkzeug von Anthropic Labs, das editierbare visuelle Arbeit erstellt, darunter Prototypen, Slides, One-Pager und Mockups, aus einem Gespräch, und es dann zu Werkzeugen wie Canva, Adobe, Figma, PowerPoint und PDF exportiert. Es startete am 17. April 2026.
Ist Claude Design kostenlos? Es ist in den bezahlten Claude-Plänen enthalten (Pro, Max, Team und Enterprise) und nutzt dein bestehendes Plan-Kontingent, mit der Option, Extra-Nutzung freizuschalten. Bei Enterprise ist es standardmäßig aus, bis ein Admin es anschaltet.
Kann Claude Design eine echte Website bauen? Es baut das Design und das darunterliegende HTML, und es kann an Claude Code übergeben, um daraus eine Produktiv-Site zu machen. Für alles, was in einer echten Codebase ausgeliefert werden muss, wird der Code in Claude Code gebaut, nicht aus dem Design-Tool exportiert.
Claude Design vs Figma vs Canva: was soll ich nehmen? Nutze Claude Design zum Starten und Erkunden (Decks, One-Pager, Landing-Page-Konzepte, E-Mail-Vorlagen). Behalte Figma als Marken-Quelle der Wahrheit und für komplexe App-UI. Nutze Canva für schnelle tägliche Social-Grafiken und Video. Sie überschneiden sich, aber jedes hat eine Aufgabe, die es am besten kann.
Kann Claude Bilder generieren? Der Adobe Connector im Chat bearbeitet Bilder, er generiert sie nicht von null. Für brandneue generierte Bilder nutzt du weiter ein dediziertes Bildmodell.
Brauche ich ein Adobe- oder Canva-Abo? Du kannst die Connectors mit einem verbundenen Konto für höhere Limits und gespeicherte Arbeit nutzen. Grundnutzung geht ohne bezahltes Kreativ-Abo, aber ein Brand-Kit oder Pro-Konto macht den Output besser und markengerecht.
