Zum Hauptinhalt
Variant

Variant: eine Idee eintippen, endlose Designrichtungen scrollen

KI-DesignUI-GenerierungDesign-InspirationPrototyping

Eine Idee für eine App oder Website eingeben und endlose Designrichtungen durchscrollen. Keine Leinwand, kein Prompt-Loop – man bleibt stehen, wo ein Entwurf überzeugt. Export als HTML oder React.

★ 9 Zuletzt aktualisiert: 2026-11-08 variant.com
Website besuchen

Detaillierte Vorstellung

Variant setzt am Anfang an

Die meisten KI-Design-Tools verlangen, dass man zuerst erklärt, was man will: welcher Stil, welche Farben, für wen. Genau das lässt sich nicht in Worte fassen, wenn die Idee gerade erst fünf Minuten alt ist. Variant tauscht die leere Leinwand gegen einen visuellen Strom, den man einfach nach unten scrollt: „eine Reise-App“ oder „eine Podcast-Website“ eintippen, weiterrollen, und jede Station ist eine andere Lesart, eine andere visuelle Sprache.

Dahinter steht Ben South, zuvor VP bei Postmates und Gründer von Sonar und Bold. Seine These: Das Schwierige ist die Richtung, nicht das Feilen. Die meisten scheitern nicht daran, ein Design zu verändern, sondern daran, zu wissen, wohin damit.

So funktioniert es

An der Bedienung gibt es nichts zu lernen: In einer Ecke sitzt ein Eingabefeld, man tippt los, und die Generierung hört nicht nach einem Vorschlag auf. Man scrollt, bis etwas passt. Derselbe Prompt kann enorm weit auseinanderlaufen – ein und dieselbe Rätsel-App kam einmal in kräftigem Rot-Orange mit einäugigem Maskottchen und schwerer schwarzer Schrift, einmal in tiefem Jägergrün mit Rangliste und italienisch anmutender Serife, einmal in reinem Weiß mit großer Display-Serife im Editorial-Format. Gleiche Struktur, drei völlig verschiedene Welten.

Dieses Erkunden im Scrolltempo ist deutlich schneller als Promptschreiben – der Preis dafür ist, dass man selbst aus einem ganzen Strom von Ergebnissen das richtige auswählen muss.

Style Dropper und der Rest

  • Style Dropper: eine Pipette für Designs. Auf ein beliebiges generiertes Ergebnis gerichtet, saugt sie dessen visuelle DNA auf – Farbwelt, typografischer Rhythmus, räumliche Dichte – und überträgt sie auf den eigenen Entwurf, wobei sich das Layout neu ordnet. South selbst nennt die Funktion „absurd, aber sie funktioniert einfach“.
  • Shuffle Layout / Remix Colors / Vary Strong·Subtle: Teile eines bestehenden Ergebnisses neu würfeln, statt von vorn zu beginnen – Layout verschieben, Farben neu mischen oder eine stärkere beziehungsweise subtilere Variante erzeugen.
  • Export: Jedes Design lässt sich als HTML ausgeben, auf Wunsch als React-Code. Aus der visuellen Erkundung wird so direkt ein lauffähiger Prototyp.
  • Community-Galerie: zeigt, wie weit andere kommen – von monochromer Rastertypografie für Berliner Techno-Flyer über brutalistische Portfolios bis zu Science-Fiction-Terminals in Grün auf Schwarz.

Preise und Schwächen

Laut Auswertungen Dritter ist Variant Freemium: ein kostenloses Kontingent in der Größenordnung von rund 300 Designs pro Monat, Pro für etwa 20 US-Dollar im Monat, für Teams individuelle Angebote. Diese Zahlen sind nur Anhaltspunkte – die vollständigen Preise zeigt die Seite erst innerhalb eines Workspace.

Die Schwäche liegt im Bearbeiten: Variant ist gut darin, viele Richtungen zu liefern, und schwach darin, präzise nachzubessern. Überlappende Elemente oder falsche Abstände löst man hier durch Neu-Würfeln, nicht durch gezieltes Verschieben. Wer eine fertige Oberfläche braucht, landet danach in Figma oder direkt im exportierten Code.

Für wen es passt

Für die früheste Projektphase, in der noch niemand den Stil kennt und man ein Dutzend Möglichkeiten auf einen Blick vergleichen will. Ebenso für Demos und die Abstimmung im Team – ein Link sagt mehr als die Beschreibung „etwas Edleres“. Nicht das richtige Werkzeug, wenn ein Designsystem bereits steht und es nur noch um die Pixel geht.

Footer Design: Galerie mit hochwertigen Referenzen für Website-Footer

Eine nach Typ und Stil sortierte Inspirationsbibliothek für Website-Footer – von typografisch über illustrativ bis Grid, Cards und animiert – jeweils mit Editor's Picks und Link zum Original.

WebdesignFooter-DesignDesign-Inspiration

Navbar Gallery: eine große Inspirationssammlung für Navigationsleisten

Eine Galerie, die ausschließlich gelungene Navbar-Designs sammelt – filterbar nach Static, Dropdown, Mega Menu, Sidebar, Suchleiste und weiteren Typen, jeweils mit Direktlink zur echten Umsetzung.

WebdesignNavigationsleisteDesign-Inspiration

shadcn/ui: Erstellen Sie Ihre Komponentenbibliothek

Prachtvoll gestaltete Komponenten, die Sie in Ihre Apps kopieren und einfügen können. Barrierefrei. Anpassbar. Open Source.

develop

Scrolltide: Scroll-gesteuerte Website-Templates mit Kinogefühl und Design-Prompts

Eine kuratierte Bibliothek aus Prompts für scroll-gesteuerte Website-Templates, Komponenten und Shader. Prompt kopieren, in die KI einfügen – und es entsteht eine Seite, die sich wirklich bewegt, statt auf den ersten Blick nach KI auszusehen.

WebdesignPromptsScroll-Animation

Stockimg AI | KI-Fotogenerator: Logo, Kunst, Stockfoto, Illustration

Stockimg ist ein All-in-One-Design- und Content-Erstellungstool, das von KI angetrieben wird. Sie können leicht Logos, Illustrationen, Hintergrundbilder, Poster und mehr generieren.

ai

Adobe Firefly - Eine neue Wahl für KI-gestützte kreative Designtools

Adobe Firefly ist eine KI-basierte Plattform für kreatives Design, die KI-Bildverarbeitungsfunktionen wie Text-zu-Bild-Generierung und Bildstil-Transformation bietet und Designern hilft, visuelle Inhalte effizient zu erstellen. Jetzt ausprobieren und Ihr kreatives Potenzial entfesseln!

AI design toolscreative content production