Claude Design: Einfache Anleitung für Einsteiger mit Beispielen

Claude Design macht aus Deiner Beschreibung einen gestalteten Entwurf, zum Beispiel für eine Landingpage (eine einzelne Webseite für Dein Angebot), einen Flyer oder eine Grafik für Social Media. Du beschreibst, was Du brauchst, und siehst Deine Idee sofort vor Dir, auch ohne Designkenntnisse.

Wie kommst Du so zu einem Entwurf, der zu Deinem Angebot passt?

Diese Anleitung zeigt Dir, wie Du Dein erstes Design erstellst, änderst, teilst und exportierst. Danach legst Du Deine eigenen Farben und Schriften fest, damit jedes neue Design nach Deiner Marke aussieht.

Was ist Claude Design?

Claude Design ist eine Funktion in Claude, dem KI-Assistenten von Anthropic. Aus Deiner Beschreibung baut Claude Design visuelle Entwürfe, etwa One-Pager (Dein Angebot auf einer Seite) oder klickbare Prototypen (Hilfe-Center von Claude).

Ein Prototyp ist ein Entwurf, in dem Du schon klicken kannst, ohne dass echte Technik dahintersteckt.

Du beschreibst links im Chat, was Du brauchst. Rechts erscheint das Ergebnis auf der Leinwand (englisch Canvas), einer großen Arbeitsfläche.

Technisch baut Claude Design kleine Webseiten in HTML, der Sprache von Webseiten. Deshalb lässt sich das Ergebnis durchklicken und als Datei herunterladen.

Fotos erzeugt Claude Design nicht, denn es hat keine eingebaute Bild-KI.

Für Logos ist es laut Nate Parrott, Produktdesigner bei Anthropic, schlecht geeignet (Claude-Blog, englisch). Dein Logo und eigene Fotos lädst Du deshalb selbst hoch.

Claude Design gehört zu den Artefakten, also zu Arbeitsergebnissen, die sich neben dem Chat öffnen. Es ist noch als Beta gekennzeichnet: Du kannst es voll nutzen, einzelne Funktionen können sich aber noch ändern.

Was kannst Du mit Claude Design erstellen?

Mit Claude Design erstellst Du Entwürfe für Webseiten, Flyer, Social Media und E-Mails sowie klickbare Prototypen. Im Arbeitsalltag sind vor allem diese Entwürfe interessant:

• Landingpage: eine einzelne Webseite mit einem Ziel, zum Beispiel Anfragen für ein Erstgespräch
• One-Pager als PDF, den Du an Interessenten verschickst
• Social-Media-Grafiken für einen Beitrag auf LinkedIn oder Instagram
• Flyer und Plakate für einen Workshop oder ein Event
• Newsletter-Layout: Aufbau und Gestaltung einer E-Mail
• Klickbarer Prototyp, etwa für ein Anfrageformular in drei Schritten

Fertige Prompts findest Du weiter unten in den Beispielen zum Kopieren.

Was Claude Design nicht kann: Eine fertige Website mit Funktionen wie Terminbuchung oder Bezahlung baut es nicht. Dafür nimmst Du zum Beispiel Claude Code, das Programmier-Werkzeug von Claude (siehe Website mit Claude Code bauen).

Ist Claude Design kostenlos? Kosten und Nutzungslimit

Nein, Claude Design ist nicht kostenlos. Du brauchst mindestens Claude Pro.

Ein Extra-Abo für Claude Design gibt es nicht.

Tarif	Preis	Claude Design
Free	kostenlos	nein
Pro	20 US-Dollar im Monat, bei jährlicher Zahlung 17 US-Dollar im Monat	ja
Max	ab 100 US-Dollar im Monat	ja
Team und Enterprise	Tarife für Firmen	ja, bei Enterprise erst, wenn ein Inhaber des Firmenkontos es einschaltet

Alle Preise gelten ohne Steuern (Preisseite von Claude). Eine kostenlose Testphase für Pro oder Max ist dort nicht aufgeführt, zum Ausprobieren reicht aber ein Monat Pro.

Jedes Design zählt auf Dein normales Nutzungslimit, genau wie Deine Chats und Claude Code. Ein ganzes Design verbraucht dabei mehr als eine normale Chat-Nachricht (Produktseite von Claude Design).

Das Nutzungslimit legt fest, wie viel Du in einem Zeitfenster von fünf Stunden mit Claude arbeiten kannst. In den bezahlten Tarifen kommt ein Limit pro Woche dazu (Preisseite von Claude). Mehr dazu steht in unserem Claude Tutorial im Abschnitt Limits.

Wo findest Du Claude Design?

Claude Design findest Du in der Seitenleiste von Claude unter Design oder Artifacts. Außerdem startest Du es im Chat, in Claude Code und unter claude.ai/design.

Für Dein erstes Design empfehlen wir die Seitenleiste:

• Seitenleiste: Unter Design oder Artifacts startest Du ein neues Design über die Karte Design, wie Schritt 1 zeigt.
• Im normalen Chat: Du bittest Claude um ein Design, umstellen musst Du dafür nichts. Wie das aussieht, zeigt unser Beispiel mit einer Instagram-Grafik.
• In Claude Code: Mit dem Befehl /design erstellst Du Designs direkt beim Programmieren (mehr dazu unter Website mit Claude Code bauen).
• Über den Knopf Output: Unter dem Eingabefeld klickst Du auf Output und wählst Claude Design. Sind Chat und Cowork bei Dir noch getrennte Modi, siehst Du den Knopf nur im Cowork-Modus, in dem Claude Aufgaben selbstständig erledigt.
• Unter claude.ai/design: Die frühere, eigenständige Seite von Claude Design, die ältere Anleitungen noch zeigen, läuft weiter, dort angelegte Designs bleiben erhalten. Auf der Seite Design führt der Knopf Eigenständige Startseite aufrufen dorthin.

So sieht das Menü hinter Output aus:

Du findest Claude Design nicht? Prüfe zuerst, ob Du einen bezahlten Tarif hast.

Danach klickst Du unten links auf Deinen Namen und öffnest Einstellungen > Funktionen. Dort müssen Artifacts und „Code-Ausführung in der Cloud und Dateierstellung“ eingeschaltet sein, sonst gibt es keine Artefakte (siehe Claude Tutorial unter Funktionen).

Claude Design auf einen Blick:

Schritt 1: Claude Design öffnen und neues Design starten

Du öffnest Claude Design über die Seitenleiste und startest ein neues Design. Als Beispiel entsteht eine Landingpage für das ausgedachte Coaching-Angebot „Ruhig verkaufen“.

Bist Du ganz neu bei Claude, hilft Dir vorher unser Claude Tutorial beim Einrichten.

1. Öffne claude.ai im Browser oder die Desktop-App von Claude.
2. Klicke in der Seitenleiste links auf Design.

Fehlt der Eintrag Design, klicke stattdessen auf Artifacts. Dort findest Du dieselbe Karte Design wie im nächsten Punkt.

3. Klicke auf der Seite Design unter „Make something new“ auf die Karte Design. Den Hinweiskasten darüber mit „Eigenständige Startseite aufrufen“ und „Team-Designsysteme migrieren“ brauchst Du dafür nicht.

Es öffnet sich eine neue Sitzung, also ein eigener Arbeitsbereich für dieses Design. Links stehen der Chat und das Eingabefeld:

Rechts liegt die noch leere Leinwand:

Beim ersten Design kannst Du hier drei Dinge übergehen:

• den Knopf Add an artboard auf der Leinwand: Artboards, also einzelne Blätter wie eine Seite oder eine Grafik, legt Claude selbst an
• die Angaben unter dem Eingabefeld, im Bild „Manuell“ und „Opus 5.5 Mittel“ (das eingestellte Modell, siehe Claude Opus 5.5)
• Choose design system…: Hier wählst Du später Dein eigenes Design-System

Einige Beschriftungen sind englisch, Deine Prompts schreibst Du trotzdem auf Deutsch.

Schritt 2: Prompt schreiben und abschicken

Ein guter Prompt für Claude Design nennt laut Anleitung von Anthropic Ziel, Aufbau, Inhalte und Zielgruppe. Nenn außerdem Farben oder einen Stil, sonst wählt Claude selbst einen.

So sah unser Prompt für die Beispiel-Landingpage aus:

„Erstelle eine moderne Landingpage für ein fiktives Online-Coaching namens ‚Ruhig verkaufen‘ für Selbstständige. Aufbau: großer Startbereich mit Überschrift und Knopf ‚Kostenloses Erstgespräch‘, drei Vorteile, Ablauf in drei Schritten, ein Platzhalter für eine Kundenstimme, Preis-Box und Kontaktbereich. Farben: dunkles Grün und warmes Beige, freundlich und seriös. Alle Texte auf Deutsch.“

Prompt verbessern

Für Dein eigenes Angebot tauschst Du Name, Abschnitte und Farben aus. Am besten ergänzt Du noch:

• Gegen erfundene Inhalte: Schreib zum Beispiel dazu „Erfinde keine Preise, Zahlen oder Kundenstimmen, setze dafür sichtbare Platzhalter in eckigen Klammern.“ So erkennst Du später sofort, was Du ersetzen musst. Unser Prompt enthielt diesen Satz noch nicht, die Folgen siehst Du in Schritt 3.
• Handy: Sag gleich, ob das Design auch auf dem Handy gut aussehen muss.
• Material: Dein Logo, ein Foto, einen Screenshot einer Seite, die Dir gefällt, oder eine abfotografierte Skizze hängst Du über das Plus-Zeichen im Eingabefeld an.

Lade nur Material hoch, das Du verwenden darfst, und keine vollständigen Kundendaten (mehr dazu im Claude Tutorial unter Datenschutz). Eine fremde Seite dient nur als Stil-Vorbild, ihre Texte und Bilder übernimmst Du nicht.

Spartipp: Je genauer der erste Prompt, desto weniger Änderungsrunden brauchst Du. Jede Runde zählt auf Dein Nutzungslimit. Fang deshalb mit einer Seite an und lass weitere Seiten erst danach bauen.

Prompt abschicken

1. Klicke in das Eingabefeld unten links und füge Deinen Prompt ein.
2. Schicke ihn mit dem Pfeil-Symbol unten rechts im Eingabefeld ab.

Ist der Prompt ungenau, stellt Claude zuerst Rückfragen. Beantworte sie kurz, dann legt Claude los.

Schritt 3: Ergebnis prüfen und Platzhalter ersetzen

Im ersten Entwurf prüfst Du vor allem Angaben, die nicht von Dir stammen.

Während Claude arbeitet, steht auf der Leinwand „Claude is working…“. Unsere Landingpage war nach etwa zwei Minuten fertig.

Fertig ist Claude, wenn im Chat eine Zusammenfassung des Designs steht. Bleibt die Leinwand trotzdem leer, lade die Seite neu (Taste F5, am Mac Cmd + R).

Heraus kam ein dunkelgrüner Startbereich mit Menü und Fotofläche, hier der Teil mit Überschrift und Knopf:

Die Zusammenfassung im Chat nennt Farben mit Farbcodes (etwa #1E3B2F für ein dunkles Grün), Schriften und eine Liste „Platzhalter, die du noch ersetzen musst“. Bei uns waren das Preis, Kundenstimme, Kontaktdaten und Foto.

Platzhalter und ausgedachte Angaben ersetzen

Wo Angaben fehlen, denkt sich Claude außerdem Inhalte aus. In unserem Entwurf waren das ein Paket mit 8 Wochen und 8 Sitzungen und eine Rückmeldezeit von zwei Werktagen.

Auch den kleinen Text neben dem Knopf, „30 Minuten · unverbindlich · per Video“, hatte Claude erfunden.

Ersetze Platzhalter und ausgedachte Angaben durch Deine echten Daten, bevor jemand anderes das Design sieht. Sag Claude dafür im Chat zum Beispiel:

„Setze als Preis [Dein Preis] ein und ersetze das Paket mit 8 Wochen durch [Deine Leistung].“

Dein Foto hängst Du über das Plus-Zeichen an und schreibst dazu, dass es in die Fotofläche soll.

Eine echte Kundenstimme mit Namen oder Foto setzt Du nur mit dem Einverständnis der Person ein. Einzelne Stellen änderst Du auch per Kommentar, wie Schritt 4 zeigt.

Lies auch die Werbetexte kritisch, denn sie sollten nach Dir klingen. Tipps dazu stehen in unserem Artikel KI-Texte vermenschlichen.

Später weiterarbeiten: Dein Design findest Du wieder in der Seitenleiste unter Design oder Artifacts, in der Liste unterhalb von „Make something new“.

Schritt 4: Design per Chat oder Kommentar ändern

Große Änderungen am ganzen Design schreibst Du in den Chat. Für eine einzelne Stelle setzt Du direkt dort einen Kommentar.

Per Chat ändern

Schreib die Änderung ins Eingabefeld, so wie den ersten Prompt, etwa „Mach das Farbschema dunkler“ oder „Füge einen Abschnitt mit häufigen Fragen hinzu“.

Bist Du unsicher, bitte um Varianten: „Zeig mir drei unterschiedliche Varianten für den Startbereich.“ Danach kombinierst Du die besten Teile, etwa mit „Nimm den Aufbau von Variante 2 und die Farben von Variante 3“.

Einen Versionsverlauf gibt es noch nicht. Sag vor großen Umbauten deshalb: „Speichere den aktuellen Stand und probiere einen ganz anderen Ansatz.“

Farben oder Abstände probierst Du mit Schiebereglern aus, die Claude auf Wunsch ins Design einbaut (Produktseite von Claude Design).

Ist das Design fast fertig, lass es von Claude prüfen:

„Prüfe das Design auf Lesbarkeit, Kontrast und Bedienbarkeit am Handy und schlage Verbesserungen vor.“

Per Kommentar an einer Stelle ändern

1. Klicke oben rechts auf das Kommentar-Symbol (die Sprechblase).

2. Klicke im Design auf die Stelle, die Du ändern willst, zum Beispiel die Überschrift. Oben im Kommentarfeld steht dann, welche Stelle Du gewählt hast.
3. Schreib Deine Änderung in das Feld, das schon mit @Claude beginnt. Wir haben geschrieben: „Mach die Überschrift etwas kleiner und schreib die zweite Zeile in Beige.“
4. Lass den Haken bei An Claude senden gesetzt und klicke rechts daneben auf den Pfeil.

Im Chat erscheint Dein Kommentar mit dem Zusatz „an Claude gesendet“. Nach etwa einer halben Minute bestätigte Claude die Änderung:

Fehlt die Änderung, lade die Seite neu. Vorher war die Überschrift groß und ganz hell:

Nach dem Kommentar ist sie kleiner, und die zweite Zeile ist beige:

Ist Dein Kommentar auf der Seite verschwunden, kopiere seinen Text in den Chat.

Laut Hilfe-Center kannst Du Elemente auf der Leinwand auch selbst verschieben, in der Größe ändern und ausrichten. Texte direkt zu ändern, gelang uns aber nicht: Ein Doppelklick markierte nur ein Wort.

Schritt 5: Design teilen oder exportieren

Ist Dein Design fertig, zeigst Du es anderen oder speicherst es als Datei, beides über den Knopf Teilen oben rechts:

• Per Link: Wer bei Claude angemeldet ist und den Link hat, kann das Design ansehen.
• Per Einladung: Nur Personen, die Du per E-Mail einlädst, öffnen das Design.
• Per Export: Du lädst das Design als PDF, PNG oder HTML herunter.

Für Link und Einladung braucht jeder ein eigenes Claude-Konto (Hilfe-Center, englisch). Eine exportierte Datei öffnet dagegen jeder, Kunden ohne Claude-Konto schickst Du deshalb besser ein PDF.

Per Link teilen

1. Klicke oben rechts auf Teilen.

2. Klicke im Fenster unter Allgemeiner Zugriff auf Nur du.

„Nur du“ steht dort, solange niemand eingeladen ist. Die Einstellung dahinter heißt Nur eingeladene Personen. Außer Dir öffnet das Design dann nur, wen Du per E-Mail einlädst.

3. Wähle Alle mit dem Link. Dann kann jeder mit Claude-Konto und Link das Design ansehen, aber nicht bearbeiten.

4. Kopiere den Link über den Knopf unten rechts im Fenster und schick ihn weiter.

Bestimmte Personen einladen

Soll nur eine bestimmte Person das Design sehen, stellst Du unter Allgemeiner Zugriff Nur eingeladene Personen ein. Dann trägst Du ihre E-Mail-Adresse oben im Teilen-Fenster in das Feld Personen per E-Mail einladen ein.

Die Person braucht ein Claude-Konto mit genau dieser E-Mail-Adresse. Verschickt wird die Einladung auf Englisch.

Danach wählst Du laut Hilfe-Center für die Person eine von drei Zugriffsstufen und schickst die Einladung ab:

• Ansehen: Die Person öffnet das Design und liest Kommentare.
• Kommentieren: Sie schreibt zusätzlich Kommentare und lädt Dateien herunter.
• Bearbeiten: Sie darf das Design außerdem ändern. Gib diese Stufe nur Personen, denen Du vertraust, denn ohne Versionsverlauf holst Du frühere Stände nicht zurück.

Teilen beenden: Wähle unter Allgemeiner Zugriff wieder Nur eingeladene Personen. Über den Link kommt dann niemand mehr hinein, der nicht eingeladen ist.

Eingeladene Personen behalten in Pro und Max aber ihren Zugriff. Du entfernst sie einzeln über ihre Zugriffsstufe im Teilen-Fenster.

Exportieren

1. Klicke oben rechts auf Teilen und wechsle im Fenster zum Reiter Export.
2. Klicke beim gewünschten Format auf den Download-Pfeil.

Format	Was Du bekommst	Ideal für
PDF	Dokument zum Drucken und Teilen	One-Pager, Flyer, Entwurf für Kunden ohne Claude-Konto
PNG	Bilddatei	Social-Media-Grafik, schnelle Vorschau per Messenger
HTML	eigenständige Webseite als Datei	Ansehen im Browser, Weiterbauen mit Claude Code
Canva	das Design wird an Canva geschickt	Feinschliff in Canva
Weitere Formate und Apps	Verbindung zu Diensten wie Adobe, Gamma, Lovable oder Miro über den Knopf Verbinden	wenn Du dort schon ein Konto hast und weiterarbeitest

Als Download standen im Reiter Export bei uns nur HTML, PDF und PNG zur Wahl, obwohl das Hilfe-Center auch PowerPoint und ZIP (gepackter Ordner) nennt.

Export prüfen: Öffne jede Datei vor dem Verschicken einmal und prüfe, ob alle Platzhalter ersetzt und Texte und Bilder vollständig zu sehen sind.

Design-System in Claude Design anlegen: Farben, Schriften, Logo

Ein Design-System ist in Claude Design die Sammlung Deiner Gestaltungsregeln: Farben, Schriften, wiederkehrende Bausteine wie Knöpfe und Karten sowie der Aufbau (Hilfe-Center). Für ein neues Design wählst Du es unter Choose design system… aus.

So beschreibst Du Deine Markenfarben nur einmal.

Design-System erstellen

1. Klicke unten links auf Deinen Namen und wähle Einstellungen.
2. Öffne den Bereich Designsysteme und klicke auf + Neues Designsystem.

3. Wähle Using Claude. Den grauen Eintrag „Using Claude Code“ brauchst Du nicht.

Es öffnet sich eine Sitzung „Untitled design system“. Claude schlägt dort drei Startwege vor: ein Code-Projekt (Sync from GitHub), Deine Konnektoren (Build from connectors) oder hochgeladene Logos und Schriften (Upload brand files). Konnektoren sind Programme, die Du mit Claude verbunden hast.

4. Beschreibe Deine Marke stattdessen direkt im Eingabefeld unten, mit Farben, Schriften und Stil. Diesen Weg haben wir getestet und empfehlen ihn für den Anfang.

Unser Prompt für die Beispielmarke:

„Baue das Designsystem aus diesen Angaben: Marke Ruhig verkaufen (fiktives Online-Coaching für Selbstständige). Farben: Waldgrün #1E3B2F als Hauptfarbe, Beige #F5EFE4 als Hintergrund, Sand #EADFCB, Akzent warmes Gold #D9B26F. Schriften: Fraunces für Überschriften, DM Sans für Fließtext. Stil: ruhig, freundlich, seriös, abgerundete Ecken. Ein Logo gibt es noch nicht.“

Hast Du ein Logo oder Screenshots Deiner Website, hänge sie über das Plus-Zeichen an. Echte Beispiele zeigen Claude mehr über Deinen Stil als eine Farbpalette allein.

5. Warte, bis Claude im Chat fertig ist, und lade die Seite dann neu. Das dauerte bei uns etwa drei Minuten.

Auf der Leinwand steht jetzt Dein Design-System. In der Leiste links wählst Du Bereiche wie Overview (Überblick mit kurzem Markenhandbuch), Colors (Farben), Typography (Schriften) und Components (Bausteine).

Claude hat dabei auch die Lesbarkeit geprüft: Unser Gold war als Schriftfarbe auf Beige zu blass, deshalb ergänzte Claude ein dunkleres Gold für Text.

Bausteine wie Knöpfe und Karten fehlten noch. Claude bot an, sie auf Nachfrage im Chat zu ergänzen.

Design-System für ein neues Design wählen

1. Starte ein neues Design wie in Schritt 1.
2. Klicke auf Choose design system… und wähle Dein Design-System im Bereich Yours.

Mit Claude Code aus dem Design eine Website bauen

Was Claude Design baut, ist ein Entwurf. Damit daraus eine Website unter Deiner eigenen Adresse wird, brauchst Du noch ein Werkzeug, das die Seite wirklich baut. Wir nutzen dafür Claude Code, das Programmier-Werkzeug von Claude.

Wie Du Claude Code einrichtest und die Website ins Internet bringst, zeigt unsere Anleitung Website mit Claude erstellen.

Damit Deine Website rund um die Uhr im Internet zu sehen ist, brauchst Du außerdem Hosting, also Speicherplatz auf einem Server. Wir empfehlen dafür das Web-App-Hosting von Hostinger*. Gib im Warenkorb den Rabattcode WPERFOLG ein, um den größtmöglichen Rabatt zu erhalten.

Ein Weg führt über eine Datei. Exportiere Dein Design als HTML und lege die Datei in den Ordner, in dem Claude Code Deine Website baut.

Dann schreibst Du Claude Code zum Beispiel:

„In diesem Ordner liegt die HTML-Datei meiner Landingpage aus Claude Design. Baue daraus eine echte Website mit demselben Aussehen und denselben Texten. Binde alle Schriften lokal ein und lade nichts von fremden Servern. Frag mich vorher nach allem, was noch fehlt, zum Beispiel Impressum und Datenschutzerklärung.“

Im Hilfe-Center steht außerdem eine direkte Übergabe an Claude Code, ohne Umweg über eine Datei. In unserem Export-Fenster fehlte sie, nimm deshalb den Weg über die HTML-Datei.

Arbeitest Du schon mit Claude Code, holst Du Designs mit dem Befehl /design auch direkt in Dein Projekt. Das klappt laut Claude-Code-Doku (englisch) ab Version 2.1.265.

Wie Du mit Claude Deine eigene Website baust, zeigen wir Dir im KI-Website-System.

Vor dem Veröffentlichen: Impressum und Datenschutzerklärung

Eine geschäftliche Landingpage braucht in Deutschland ein Impressum (§ 5 Digitale-Dienste-Gesetz) und eine Datenschutzerklärung (Art. 13 DSGVO), auch wenn sie nur aus einer Seite besteht.

Das Impressum erstellst Du am einfachsten mit dem kostenlosen Impressum-Generator von eRecht24*. Für die Datenschutzerklärung eignet sich zum Beispiel der kostenlose Datenschutz-Generator von WBS.LEGAL.

Claude Design im Vergleich: Slides, Docs, Canva und Figma

Claude Design nimmst Du für Webseiten und Grafiken, Claude Slides für Präsentationen und Claude Docs für Dokumente.

Entwürfe aus Claude Design schickst Du per Knopf an Canva und gestaltest dort selbst weiter. Einen eingebauten Export nach Figma gibt es nicht.

Womit	Wofür	Export und Zusammenspiel
Claude Design	Landingpages, One-Pager, Flyer, Grafiken, klickbare Prototypen	HTML, PDF, PNG, Senden an Canva und weitere Dienste
Claude Slides	Präsentationen aus Notizen, Berichten oder dem Chat, direkt in Claude vorführen	PowerPoint, PDF
Claude Docs	Dokumente, die Du mit Claude und Deinem Team gemeinsam schreibst	Word, PDF, Markdown (einfaches Textformat), Google Docs
Einfaches Artefakt ohne Claude Design	kleine Werkzeuge wie ein Rechner, auch im kostenlosen Tarif. Claude Design gibt es dort nicht.	Teilen per Link nur in bezahlten Tarifen
Canva	Online-Grafikprogramm, in dem Du mit fertigen Vorlagen selbst gestaltest	Claude Design schickt Entwürfe per Knopf dorthin
Figma	Profi-Programm, mit dem Designer Websites und Apps gestalten	kein eingebauter Export nach Figma; Figma-Dateien lädst Du als Grundlage für Dein Design-System hoch

Quellen: Hilfe-Center zu Artefakten, Teilen und Design-System.

Tipps, Grenzen und häufige Probleme

Diese Grenzen von Claude Design solltest Du kennen:

• Es ist noch eine Beta, Funktionen können sich ändern.
• Einen Versionsverlauf gibt es noch nicht.
• Fotos und KI-Bilder erzeugt Claude Design nicht, für Logos ist es schlecht geeignet.
• Geteilte Designs öffnet nur, wer ein Claude-Konto hat.
• In unseren Tests zeigte die Leinwand neue Designs und Änderungen erst nach dem Neuladen der Seite.

Weitere Stolperstellen und ihre Lösung:

Problem	Lösung
Das Design wirkt beliebig.	Farben, Schriften oder Beispiel-Screenshots vorgeben oder ein Design-System anlegen und auswählen.
Deine Oberfläche sieht anders aus als in älteren Anleitungen.	Ältere Anleitungen zeigen noch claude.ai/design mit eigenem Wochenlimit. Heute startest Du es meist über die Seitenleiste, und es zählt auf Dein normales Nutzungslimit.
Dein Design-System aus dem früheren Claude Design fehlt in der Auswahl.	In den Einstellungen trägt es das Schild „Eigenständig“. Übernimm es auf der Seite Design über den Knopf Team-Designsysteme migrieren.
Das Nutzungslimit ist erreicht.	Bis zum Zurücksetzen warten oder mit Nutzungsguthaben weiterarbeiten, also mit zusätzlich gekaufter Nutzung.

Beispiele für Claude Design: Drei Prompts zum Kopieren

Hier findest Du Prompts für eine Instagram-Grafik, einen One-Pager als PDF und ein klickbares Anfrageformular. Tausche Namen, Inhalte und Farben gegen Deine eigenen aus.

Instagram-Grafik direkt im Chat

Für eine schnelle Grafik musst Du keine Design-Sitzung öffnen. Wir haben im normalen Chat geschrieben:

„Erstelle mir mit Claude Design eine quadratische Instagram-Grafik für ein fiktives Café namens Kaffeeliebe: Überschrift Neu: Herbst-Latte, warme Herbstfarben, kurzer Text und Platz für ein Foto.“

Bei uns lag schon ein Design-System im Konto. Deshalb fragte Claude vorher mit einer Auswahlkarte nach, ob es dieses nutzen oder einen eigenen Herbst-Look gestalten soll. Wir haben den eigenen Look gewählt:

Danach öffnete sich rechts die Leinwand, nach etwa einer Minute und einem Neuladen der Seite war die Grafik zu sehen:

Dein eigenes Foto setzt Du wie in Schritt 3 ein. Danach lädst Du die Grafik unter Teilen im Reiter Export als PNG herunter und postest sie bei Instagram.

One-Pager für Interessenten

Hänge vorher Deine Leistungsbeschreibung über das Plus-Zeichen an.

Mach aus meiner angehängten Leistungsbeschreibung einen One-Pager im A4-Hochformat für [Deine Zielgruppe]. Oben mein Logo und eine klare Überschrift, darunter meine Pakete nebeneinander, dann der Ablauf der Zusammenarbeit in vier Schritten und unten Platz für meine Kontaktdaten. Übernimm Preise und Leistungen genau aus der Datei und erfinde nichts dazu.

Den fertigen One-Pager exportierst Du als PDF und schickst ihn per E-Mail. Vergleiche vorher Preise und Pakete mit Deiner Leistungsbeschreibung.

Klickbares Anfrageformular

Baue einen klickbaren Prototyp für das Anfrageformular meiner Fotografie-Website. Schritt 1: Art des Shootings wählen (Hochzeit, Business, Familie). Schritt 2: Wunschtermin und Ort. Schritt 3: Kontaktdaten. Je nach Auswahl in Schritt 1 sollen passende Zusatzfragen erscheinen. Am Ende eine Danke-Seite. Abgeschickt werden muss noch nichts.

So klickst Du den Ablauf einmal selbst durch, bevor Du ein echtes Formular einrichtest.

Fazit: Für wen lohnt sich Claude Design?

Nutzt Du Claude Pro oder Max schon, ist Claude Design ohne Aufpreis dabei. Dann lohnt es sich für den ersten Entwurf jeder Landingpage und jedes Flyers, den Du sonst bei einem Designer bestellen würdest.

Einen Website-Baukasten ersetzt Claude Design nicht, es liefert nur den Entwurf. Die fertige Website baust Du danach mit Claude Code oder baust sie mit einem Baukasten wie dem Hostinger KI Builder nach.

Ein Abo nur wegen Claude Design rechnet sich, wenn Du regelmäßig solche Entwürfe brauchst. Jeder Entwurf ist dann schnell fertig: Unsere Beispiel-Landingpage hatte nach etwa zwei Minuten alle gewünschten Abschnitte.

Ein Logo und den letzten Schliff einer wichtigen Website überlässt Du besser einem Designer.

Starte mit einer einzelnen Seite. Danach legst Du Dein Design-System an.