
Vorschaugalerie
Ähnliche Skills
Alle Skills ansehenDas bekommst du
- Eine Developer-Tool-Website mit funktionierendem Produkt-Hero: ein Content-Studio mit Einträgen, Status-Pills, Filtern, Suche und API-Playground unter einer ruhigen, zentrierten Headline
- Feature-Bento, Modell-Sync-Demo, Quickstart-Tabs, Branch-Merge-Flow, Sicherheit, Kundenstory, Preise und FAQ, dazu Docs-, Changelog-, Auth-, Kontakt-, Status- und Rechtsseiten
- Helles und dunkles Theme sowie generierte redaktionelle Fotos für Kundenstory, Medienbibliothek und Avatare, alles eingebettet in eine Datei, die offline funktioniert
Passt gut für
- Teams, die eine API, ein Headless CMS, ein SDK oder ein Infrastrukturprodukt launchen und das Produkt über funktionierende UI für sich sprechen lassen wollen
- Entwicklerorientierte Gründer, die Docs-, Changelog-, Preis-, Auth- und Statusseiten passend zur Landing Page brauchen
- Teams, die eine Offline-Datei für eine Demo oder einen Launch wollen oder dasselbe Design in ein bestehendes Framework-Projekt übertragen möchten
Nicht geeignet für
- Consumer-, Lifestyle- oder Retail-Marken: Das umrandete Raster, die Monospace-Details und die Code-Tabs sprechen Entwickler an
- Teams, die ein datenbankgestütztes CMS oder einen echten Blog brauchen: Inhalte liegen als statische Daten in der Seite
- Echte Registrierung, Abrechnung oder Uptime-Monitoring: Formulare und Statusseite sind Frontend-Simulationen mit Platzhalterdaten
Produktlaunch & App-WachstumWebdesign & digitale ErlebnisseWebseite erstellenLanding Page erstellenWebsite-Vorlage aufsetzenStil fixiertBearbeitbares ErgebnisConversion-fokussiertHell zuerstUmrandetes RasterCode-TabsFlache UI-MockupsGrüner AkzentMonospace-Deko
Über diesen Skill

Contexa CMS Landing baut eine Marketing-Website für ein Entwicklerprodukt, das sich über funktionierende UI selbst erklärt. Sie ist zuerst hell und nahezu neutral mit einem grünen Akzent, gesetzt in ein dünn umrandetes Raster mit kompakter Display-Schrift und Monospace-Details. Das Beispiel ist Contexa, ein fiktives Headless CMS, gezeigt mit dem Kunden-Workspace Halvorne Travel.

Das bekommst du
- Ein klickbares Content-Studio im Hero: Einträge mit Status-Pills, Filter-Chips, Suche mit Leerzustand und ein Request-/Response-Panel
- Landing-Abschnitte in abwechslungsreichen Layouts: Feature-Bento, eine Demo zur Synchronisation vom Modell ins Studio, Quickstart-Tabs pro Framework, Content-Branches mit Merge-Flow, Sicherheit und Status, eine Kundenstory, Preise mit Abrechnungsschalter, FAQ und Registrierung
- Unterseiten: Docs mit Suche, Changelog und Roadmap, Registrierung, Anmeldung, Vertriebskontakt, Kundenstory, Status, Datenschutz, AGB und eine Not-found-Seite
- Helles und dunkles Theme, ein invertierter Footer unter einer riesigen, verblassten Wortmarke und eine Datei, die in jedem Browser öffnet und offline funktioniert

So nutzt du es
- Teile Produktname, Versprechen in einem Satz, zentrale Objekte, unterstützte Frameworks und Tarife; Fehlendes wird entworfen und dir aufgelistet.
- Dein Agent baut das Studio um die Objekte deines Produkts herum neu auf, schreibt jeden Abschnitt und jede Seite um und generiert passende Fotos.
- Öffne die Datei, wechsle zwischen Hell und Dunkel, klick dich durch alle Tabs, Formulare und Seiten und beschreibe Änderungen in eigenen Worten.

Fotos kommen vom Bildtool deines Agenten, sofern verfügbar, wofür dessen Nutzungskosten anfallen können. Alle Kunden, Personen und Zahlen im Beispiel sind fiktiv und werden durch deine Fakten oder klar aufgelistete Platzhalter ersetzt.
Was du vorab brauchst
- Du bringst mit
- Produktname, Versprechen in einem Satz und die zentralen Objekte (Einträge, Requests, Jobs oder Deployments) · Unterstützte Frameworks oder SDKs, der Installationsbefehl sowie Tarifnamen und Preise · Sicherheitsfakten, Kunden und Zitate, die du bestätigen kannst (optional; Lücken werden zu aufgelisteten Platzhaltern)
- Abhängigkeiten
- Node.js 18 oder neuer auf dem Rechner deines Agenten, um das mitgelieferte Skript auszuführen, das die einzelne Offline-Datei baut · Internetzugang während des Builds, damit die Schriften einmal heruntergeladen und eingebettet werden können · Ein Bildtool in deinem Agenten für die redaktionellen Fotos (optional; ohne lieferst du Fotos oder bekommst beschriftete Platzhalter)
- Externe Kosten
- Fotos für Kundenstory, Medienbibliothek und Avatare werden, sofern verfügbar, mit dem Bildtool deines Agenten generiert, wofür dessen Nutzungskosten anfallen können. Ohne Bildtool nutzt der Agent deine Fotos oder lässt klar beschriftete Platzhalter. Sonst wird kein kostenpflichtiger Dienst genutzt.
- Zuletzt getestet
- v1.0.6 — Claude Code / Claude Desktop / Cowork / Codex / ChatGPT
Nutzerbewertungen
Bewertungen werden geladen …









