FERTIGE WEBSITE-VORLAGEN + KI

Deine erste Website. Wähle ein fertiges Design. Ändere es, indem du der KI schreibst.

Lade eine Vorlage mit fertigem Layout, Bildern und Anweisungen herunter. Beschreibe in einem KI-Tool, das Dateien bearbeitet, deinen Namen, Text oder eine Farbe. Öffne die Vorschau und prüfe die Änderung.

Vorlage für deine erste Website wählen PRO-Zugang wählen

Claude · Codex/ChatGPT · Gemini · Cursor

VYNE → LENA

AI ChatDeine erste Änderung: Name und Text

Arbeite mit den angehängten Dateien index.html und RECREATE.md aus dem VYNE-Projekt. Ändere den Namen in der oberen Leiste und den großen Schriftzug am Anfang der Seite in „LENA“. Schreibe unter den großen Namen: „Das ist meine erste Website. Hier zeige ich, was ich gern gestalte.“ Füge darunter den Button „Meine Projekte ansehen“ hinzu, der zum Projektbereich führt. Speichere die bearbeitete index.html und zeige eine Vorschau. Behalte das übrige Layout und die Bilder bei.

index.html · RECREATE.md

Die Vorschau zeigt LENA, den neuen Satz und einen Button zum Projektbereich. Prüfe die Änderung und behalte die Datei, damit du mit deiner nächsten Idee zu ihr zurückkehren kannst.

Du arbeitest in deinem eigenen KI-Tool, das Website-Dateien bearbeitet und speichert.

Anweisung zum Kopieren

Arbeite mit den angehängten Dateien index.html und RECREATE.md aus dem VYNE-Projekt. Ändere den Namen in der oberen Leiste und den großen Schriftzug am Anfang der Seite in „LENA“. Schreibe unter den großen Namen: „Das ist meine erste Website. Hier zeige ich, was ich gern gestalte.“ Füge darunter den Button „Meine Projekte ansehen“ hinzu, der zum Projektbereich führt. Speichere die bearbeitete index.html und zeige eine Vorschau. Behalte das übrige Layout und die Bilder bei.

Original-VYNE und ein vorbereitetes Beispiel der ersten Änderung. Name, Satz und Button am Anfang wurden geändert; die übrigen Inhalte stammen aus dem fiktiven Design. AI Chat zeigt ein Beispielgespräch ohne Live-Verbindung zu einer KI.

Projektdateien

Gib der KI den entpackten Projektordner. Wenn das Tool Anhänge annimmt, füge die Dateien nach seiner Anleitung hinzu.

index.htmlRECREATE.mdassets/

01 / WAS MACHST DU MIT DER HERUNTERGELADENEN VORLAGE?

Herunterladen. Dateien übergeben. Änderung beschreiben.

Wähle für den ersten Versuch eine Sache: einen Namen oder einen kurzen Satz. Sieh dir an, wie deine Worte die fertige Website verändern.

ZIP herunterladen und entpacken.

Öffne die Vorschau deiner gewählten Vorlage. Entpacke nach dem Download die ZIP und behalte den ganzen Ordner. VYNE enthält index.html, RECREATE.md und den Ordner assets.

Das Projekt an deine KI übergeben.

Nutze ein KI-Tool, das Dateien bearbeitet. Öffne darin den Projektordner oder füge die Dateien als Anhänge hinzu. Kopiere die Beispielanweisung und schreibe deinen eigenen Namen und Satz.

Die bearbeitete Datei öffnen.

Speichere die bearbeitete index.html im Projektordner. Öffne sie per Doppelklick im Browser. VYNE braucht Internet für Bilder und Schrift. Du kannst auch die Website-Vorschau deines KI-Tools nutzen, falls es eine anbietet.

02 / DIE ERSTE VERSION IST DA. PROBIERE EINE WEITERE ÄNDERUNG.

Anderer Text und andere Farbe? Beschreibe sie im nächsten Satz.

Kehre zur gespeicherten Website zurück. Wähle einen Button und beschreibe sein Aussehen. Vergleiche dann die neue Vorschau mit der vorherigen.

LENA

AI ChatBeispielgespräch

Ändere die Akzentfarbe in Hellviolett (#b78cff). Ändere den Text des Buttons unter der Beschreibung von „Meine Projekte ansehen“ in „Sieh, was ich gestalte“. Der Button soll weiterhin zum Projektbereich führen. Zeige eine neue Vorschau.

Der Button unter der Beschreibung hat einen neuen Text und eine hellviolette Farbe. Er führt weiterhin zu den Projekten auf dieser Seite. Vergleiche die Vorschauen und klicke den Button an, um den Link zu prüfen.

Zwei vorbereitete Versionen der ersten Änderung. Die zweite ändert Akzentfarbe und Button-Text; der Link führt zum Projektbereich.

03 / WÄHLE EIN DESIGN, DAS DU BEARBEITEN MÖCHTEST

Starte mit einer Website, die du schon ansehen kannst.

Öffne die vollständige Vorschau. Prüfe Layout, Bilder und Buttons. Wähle ein Design, das du mit deinem Namen und deinen Inhalten ergänzen möchtest.

VYNE / dein erster Versuch

Ein großer Name, Bilder und fertige Seitenbereiche. Starte mit der Änderung aus dem Beispiel. VYNE kannst du kostenlos herunterladen.

Diese Vorlage ansehen

Primefolio / ein helles Design

Eine helle Website mit Arbeiten, Beschreibungen und aufklappbaren Antworten. Wähle sie, wenn du dieses Layout an dich anpassen möchtest.

Diese Vorlage ansehen

Velora / eine Produktwebsite

Ein anderes Layout: eine große Überschrift und eine Beispielansicht eines Produkts. Sieh dir dieses Design an, wenn du eine Website für ein Produkt oder eine Idee vorbereiten möchtest.

Diese Vorlage ansehen

04 / WAS DU BEKOMMST UND WAS DU SELBST MACHST

Ein fertiges Layout. Deine Worte und Entscheidungen.

Design und Anleitung im Paket

Du wählst ein bestehendes Design mit Layout, Farben und Bildern.
Änderungen an Namen, Inhalten oder Farben beschreibst du in einfachen Worten einer KI, die Dateien bearbeitet.
Du speicherst weitere Versionen und öffnest die Vorschau, um die Änderungen zu sehen.

Was du noch vorbereiten musst

Du wählst ein KI-Tool, gibst ihm die Dateien und prüfst seine Arbeit.
Eine öffentliche Website-Adresse braucht separates Hosting und eine Domain-Konfiguration.
Nachrichten, Buchungen oder Zahlungen brauchen eine Umsetzung oder die Verbindung mit einem passenden Dienst.

Probiere deine erste Änderung mit dem kostenlosen VYNE.

Lade die ZIP herunter, entpacke die Dateien und probiere die Änderung aus dem Beispiel. Sieh deinen Namen in der Vorschau, bevor du dein nächstes Design wählst.

VYNE kostenlos herunterladen

DIE TEMPLATE-BIBLIOTHEK

Wähle ein Design für deine erste Website.

Wähle ein fertiges Layout und beschreibe der KI deine Inhalte, deinen Namen und die gewünschten Änderungen.

Den gesamten Katalog ansehen

82 Website-Templates

Savi Template ansehen

Rondist – Website Template for AI Agents

Rondist Template ansehen

Passer Template ansehen

Outer Light – Website Template for AI Agents

Outer Light Template ansehen

Osma Template ansehen

Nightglass – Website Template for AI Agents

Nightglass Template ansehen

Lark Template ansehen

Drumlin – Website Template for AI Agents

Drumlin Template ansehen

Aveniq Template ansehen

Novera Template ansehen

Aurelia Atelier – Website Template for AI Agents

Aurelia Atelier Template ansehen

Nivora Template ansehen

WÄHLE DEINEN ZUGANG

Nimm eine Vorlage. Oder die ganze Bibliothek mit Website-Vorlagen, Fotos, Mockups, Presets und mehr — in einem PRO-Plan.

Wähle ein Design für deine erste Website oder eine Bibliothek, wenn du weitere Ideen ausprobieren möchtest.

Ein einzelnes Template

Ein fertiges Design für deine erste Website.

€32,32 EUR/ Template

Dein gewähltes Website-Design
Quelldateien und KI-Anweisungen
Einmal zahlen

Mein erstes Design wählen

PRO Yearly

Für deine nächsten Ideen. Die gesamte PRO-Bibliothek während deines aktiven Abonnements.

€167,18 EUR/ Jahr

Die gesamte Website-Template-Bibliothek
Fotos, Mockups, Presets, LUTs und Texturen
Ein Jahr Zugang zur PRO-Bibliothek
Automatische Verlängerung jedes Jahr. Jederzeit kündbar.

Spezielles Lifetime-Angebot

PRO Lifetime

Eine Bibliothek für kommende Ideen. Zugang zu PRO mit einer Zahlung.

Vorheriger Preis~~€667,67 EUR~~

€221,81 EUR/ einmalig

Die gesamte Website-Template-Bibliothek
Fotos, Mockups, Presets, LUTs und Texturen
Lifetime-Zugang zur PRO-Bibliothek
Einmal zahlen. Keine jährliche Verlängerung.

Preise für Commercial Use. Preise und Steuern werden im Checkout bestätigt. KI-Tool, Domain und Hosting sind separat.

05 / VOR DEINEM ERSTEN DOWNLOAD

Was solltest du zum Start wissen?

Was bekomme ich beim Download einer Vorlage?

Dateien einer fertigen Website und Anweisungen für die weitere Arbeit. VYNE enthält index.html, RECREATE.md und den Ordner assets mit Bildern. Entpacke die ZIP und behalte den ganzen Ordner. Den Inhalt anderer Vorlagen findest du auf ihren Produktseiten.

Schaffe ich das ohne Kenntnisse in Programmierung und Design?

Eine Änderung an Namen, Text oder Farbe kannst du einer KI, die Dateien bearbeitet, in einfachen Worten beschreiben. Die fertige Vorlage gibt dir Layout und Design. Du wählst die Änderung, übergibst das Projekt und prüfst die Vorschau. Lade VYNE kostenlos herunter, um diese Arbeitsweise zuerst mit einer kleinen Änderung auszuprobieren.

Welche KI brauche ich und welche Dateien soll ich hinzufügen?

Wähle ein KI-Tool, das mit Projektdateien arbeitet und bearbeitetes HTML speichert. Öffne darin den entpackten Ordner oder füge die Dateien nach seiner Anleitung hinzu. Nutze bei VYNE index.html, RECREATE.md und die mitgelieferten Bilder. Die Funktionen hängen vom Tool und Tarif ab; KI wählst und bezahlst du separat.

Wie sehe ich die Website nach einer Änderung?

Speichere die bearbeitete index.html im Projektordner und öffne sie per Doppelklick. Die Website erscheint im Browser. VYNE lädt Bilder und Schrift aus dem Internet und braucht eine Verbindung. Wenn dein KI-Tool eine Website-Vorschau anbietet, kannst du auch diese nutzen. Prüfe Text, Bilder und Buttons.

Kann ich die Vorschau sofort als meine Website verschicken?

Eine auf deinem Computer geöffnete Datei hat keine öffentliche Adresse. Um die Website im Internet zu teilen, wähle Hosting, veröffentliche die Dateien und konfiguriere eine Domain. Diese Dienste sind separat. Prüfe die ganze Website vor der Veröffentlichung; funktionierende Nachrichten, Buchungen und Zahlungen brauchen eine Umsetzung oder einen verbundenen Dienst.