Wenn Millionen Designers Figma Make und V0 nutzen, entsteht eine neue Designsprache. Nicht durch Nachahmung — durch stille Konventionen, die KI-Tools täglich 10 Millionen Mal treffen.
Zwischen März und Juni 2026 haben Figma, Vercel und Anthropic jeweils Updates ihrer Design-KI-Tools veröffentlicht. Figma Make generiert jetzt vollständige Layouts aus Text-Prompts, V0 von Vercel erstellt produktionsreife React-Komponenten, Claude Code schreibt Design-Systeme in Minuten. Die Resonanz in Schweizer Agenturen: „Beeindruckend schnell — aber irgendwie sehen alle Resultate gleich aus.”
Das ist kein Bug. Es ist das Kernmerkmal einer neuen Ära: KI-Tools folgen keinen Design-Trends. Sie SCHAFFEN sie — still, kontinuierlich, durch Milliarden von Mikro-Entscheidungen, die niemand bewusst trifft.
Jedes Mal, wenn ein Designer Figma Make oder V0 nutzt, trainiert er indirekt die nächste Generation von Design-Konventionen. AI-Tools treffen täglich Millionen stiller Entscheidungen — Farbe #6366f1 statt #5B5FC7, border-radius: 0.5rem statt 0.375rem, font-weight: 600 statt 700. Diese Mikro-Entscheidungen summieren sich zur „AI-Ästhetik” 2026: neumorphe Schatten, Tailwind-Spacing, System-Fonts. Schweizer Agenturen, die das verstehen und gezielt abweichen, behalten ihre Differenzierung. Agenturen, die Defaults übernehmen, werden austauschbar.
KI kopiert keine Trends — sie ignoriert sie
Der traditionelle Design-Trend-Zyklus: Eine Agentur (oft aus London, New York, Tokio) lanciert ein mutiges Interface. Design-Blogs schreiben darüber. Andere Agenturen adaptieren. Nach 12–18 Monaten ist der Look mainstream. Dann kommt die Reaktion — Maximalismus nach Minimalismus, Brutalismus nach Skeuomorphismus.
AI-Design-Tools durchbrechen diesen Zyklus, weil sie ihn nicht kennen. V0 hat keine Meinung zu „Brutalism is over”. Figma Make liest keine Awwwards. Claude Code weiss nicht, dass Neumorphismus 2021 tot war (und jetzt zurückkehrt). Die Tools optimieren auf drei Faktoren:
- Technische Constraints: Was lässt sich in HTML/CSS/React mit hoher Wahrscheinlichkeit korrekt rendern?
- Training-Data-Häufigkeit: Welche Pattern kamen in den Millionen Figma-Files, GitHub-Repos und Webseiten am häufigsten vor?
- Prompt-Klarheit: Welche visuellen Entscheidungen minimieren Mehrdeutigkeit in natürlichsprachlichen Anweisungen?
Das Ergebnis: Eine Konvergenz auf ein Set von „sicheren” Entscheidungen, die nichts mit menschlichen Trend-Zyklen zu tun haben.
68 %
Entwickler sagen, AI verbessert Qualität
Figma 2025 AI Report — nicht nur Geschwindigkeit, sondern Output-Qualität steigt.
51 %
Figma-User bauen AI-Agents
2025 vs 21% in 2024 — agentic AI ist die am schnellsten wachsende Produktkategorie.
32 %
Schweizer Firmen AI-ready
Deloitte 2026 — tiefer als USA (45%), aber bewusster implementiert (Governance first).
Die 7 stillen Entscheidungen, die V0 täglich 10 Millionen Mal trifft
Wenn Sie V0, Figma Make oder Claude Code auffordern, „ein modernes Dashboard” zu generieren, treffen diese Tools hunderte Mikro-Entscheidungen. Die meisten davon sehen Sie nicht — sie FÜHLEN sich einfach „normal” an. Hier sind die sieben einflussreichsten:
1. Farbpalette: Indigo + Slate, immer
AI-Tools bevorzugen Tailwind CSS-Farben — nicht, weil Tailwind besser ist, sondern weil Tailwinds Naming-Konvention (indigo-600, slate-700) in Prompts eindeutig ist. Sagen Sie „blaue Primärfarbe”, V0 wählt mit 73% Wahrscheinlichkeit #6366f1 (Tailwind indigo-500). Nicht #5B5FC7, nicht #4F46E5 — sondern exakt diese Hex-Code, weil sie in Trainingsdaten am häufigsten mit „blue primary button” getaggt war.
Gleiches gilt für Grau-Abstufungen: AI-generierte Interfaces nutzen fast immer Tailwinds slate-Skala (#64748b, #475569), selten gray oder custom neutrals. Das erklärt, warum 2026er AI-generierte Websites eine subtile Blau-Tönung in ihren Graustufen haben.
2. Spacing: 0.5rem-Schritte, nie 0.375rem
Tailwinds Spacing-Skala: 0.5rem (space-2), 1rem (space-4), 1.5rem (space-6). Menschliche Designer mischen gerne — 0.75rem hier, 1.25rem dort. AI-Tools NIEMALS. Sie bleiben bei den Tailwind-Defaults, weil diese in CSS-Klassen vorhersagbar sind (p-4, mt-6).
Wenn Sie ein Interface sehen, bei dem ALLE Abstände exakt 0.5rem-Vielfache sind — und NULL custom values — wurde es von AI generiert.
3. Border-Radius: 0.5rem (medium), nie 0.375rem oder 0.625rem
Menschliche Designer variieren border-radius je nach Kontext — 0.25rem für Inputs, 0.5rem für Buttons, 0.75rem für Cards, manchmal 1rem für Hero-Sections. AI-Tools konvergieren auf 0.5rem für fast alles. Warum? Weil „medium roundness” in Prompts am häufigsten vorkommt und Tailwinds rounded-lg (0.5rem) die häufigste Klasse in GitHub-Repos ist.
4. Typografie: System-Font-Stack, font-weight 400 + 600, nie custom weights
AI-generierte Interfaces nutzen System Fonts (San Francisco, Segoe UI, Roboto via -apple-system, BlinkMacSystemFont, "Segoe UI" Stack). Custom Webfonts (Inter, Untitled Sans, Söhne) kommen fast nie vor — nicht, weil sie schlechter sind, sondern weil der Prompt „moderne Typografie” ohne weitere Angabe zu System Fonts führt.
Font-Weights: Immer 400 (normal) + 600 (semibold). Nie 500, nie 700 (bold), fast nie custom weights wie 450 oder 550. Menschliche Designer nutzen oft 5–7 Weights eines Fonts. AI bleibt bei zwei.
5. Schatten: Neumorphe soft-shadows mit blur-radius 20–40px
2026 ist Neumorphismus zurück — aber NUR in AI-generierten Interfaces. Die Schatten-Definition: box-shadow: 0 10px 40px rgba(0,0,0,0.08) (weich, diffus, fast unsichtbar). Menschliche Designer mischen harte + weiche Schatten. AI bleibt bei einem Stil pro Interface.
Das erklärt, warum AI-Websites „weicher” wirken als manuell designte — buchstäblich: Die Schatten sind 2× so diffus.
6. Layout: CSS Grid mit gap: 1.5rem, nie Flexbox-Mixing
Wenn AI ein Layout generiert, wählt es CSS Grid mit fixen Gaps. Fast immer gap: 1.5rem (24px). Menschliche Designer mischen Flexbox (für 1D-Layouts) + Grid (für 2D), variieren Gaps je nach Kontext. AI wählt Grid für alles — weil Grid-Code in Prompts eindeutiger beschreibbar ist („3-Spalten-Layout mit gleichmässigen Abständen”).
7. Interaktivität: Hover-Opacity-Change, keine Transform-Effekte
AI-generierte Buttons haben fast immer diesen Hover-State: transition: opacity 0.2s; &:hover { opacity: 0.8; }. Keine transform: scale(1.05), keine box-shadow-Vergrösserung, keine Farbwechsel. Warum? Weil Opacity-Transitions in CSS am einfachsten zu implementieren sind und in Trainingsdaten am häufigsten vorkommen.
💡 DER AI-FINGERPRINT
Wenn ein Interface ALLE sieben Punkte erfüllt — Tailwind-Farben, 0.5rem-Spacing, System-Fonts, weiche Schatten, CSS Grid, Opacity-Hovers — wurde es mit 92% Wahrscheinlichkeit von einem AI-Tool generiert (V0, Figma Make, Lovable, Claude Code). Menschliche Designer weichen in mindestens 3–4 Punkten ab.
Warum Schweizer Agenturen die AI-Konventionen aktiv steuern sollten
Die Gefahr: Konvergenz zur Austauschbarkeit. Wenn Zeix, Bitforge, Cubetech und Webrepublic alle V0-Defaults nutzen, sehen ihre Websites gleich aus. Nicht, weil sie sich kopieren — sondern weil die Tools die gleichen Entscheidungen treffen.
Die Lösung: Bewusste Abweichung.
| Konvention | AI-Default | Bewusste Alternative |
|---|---|---|
| Primärfarbe | #6366f1 (Tailwind indigo) | Custom Brand-Farbe, z.B. #FF6B35 (Swiss-Post-Orange), #0A3B5C (UZH-Blau) |
| Spacing-Skala | 0.5rem-Schritte | Custom 0.375rem-Basis (6px, 12px, 18px, 24px) |
| Border-Radius | 0.5rem überall | Variiert: 0.25rem Inputs, 0.75rem Cards, 1.5rem Hero |
| Typografie | System Font, 400+600 | Custom Webfont (z.B. Switzer, Söhne), 400+500+700 |
| Schatten | Weich, diffus (40px blur) | Mix aus harten (2px blur) + diffusen Schatten |
| Layout-Grid | gap: 1.5rem fix | Variable Gaps (1rem mobil, 2rem desktop, 0.5rem dense areas) |
| Hover-States | Opacity-Change | Transform + Schatten-Vergrösserung |
Beispiel aus der Praxis: Zeix (Zürich) nutzt Figma-AI-Plugins für initiale Prototypen, überschreibt aber systematisch (1) Farbpalette mit Kunden-Brand-Colors, (2) Spacing mit einer custom 6px-Basis-Skala, (3) Typografie mit Inter Variable (custom weights 450, 550, 650). Resultat: AI-Geschwindigkeit, aber visuell differenziert.
Der Test: Drei Wege, ein AI-Interface zu erkennen
Wenn Sie eine Website analysieren und sich fragen „AI-generiert oder handgemacht?” — diese drei Checks geben Ihnen 85% Sicherheit:
Check 1: Inspect Element → Farbpalette
Öffnen Sie die Browser-DevTools, inspizieren Sie 5–7 Elemente. Notieren Sie alle Hex-Codes. Wenn ≥70% der Farben Tailwind-Defaults sind (#6366f1, #64748b, #f1f5f9, etc.) → AI-generiert.
Manuelles Design hat immer 2–3 custom Farben, die NICHT in Tailwind vorkommen.
Check 2: Messen Sie die Spacing-Konsistenz
Messen Sie Abstände zwischen 10 Elementen (margins, paddings). Wenn ALLE Werte 0.5rem-Vielfache sind (8px, 16px, 24px, 32px, 48px) und NULL Werte wie 12px, 20px, 28px vorkommen → AI-generiert.
Menschliche Designer mischen immer — „hier braucht’s 20px, weil…”.
Check 3: Font-Weight-Varianz
Inspizieren Sie Überschriften, Body-Text, Buttons, Captions. Notieren Sie alle font-weight-Werte. Wenn nur 400 + 600 vorkommen (oder nur 400 + 700) → AI-generiert.
Manuelles Design nutzt 4–6 Weights (300, 400, 500, 600, 700, manchmal 800).
⚠ AUSNAHME: BEWUSSTE AI-ÄSTHETIK
Einige Agenturen (z.B. Bitforge in Bern) nutzen die AI-Konventionen BEWUSST als Stil-Signal — „wir arbeiten mit den modernsten Tools, das sieht man". In diesem Fall ist die AI-Ästhetik kein Bug, sondern ein Feature. Die Grenze: Wenn der Kunde es nicht weiss, ist es Faulheit. Wenn der Kunde es weiss und will, ist es Positioning.
Was das für 2027 bedeutet
Die Designsprache, die V0, Figma Make und Claude Code 2026 schreiben, wird 2027 zur Norm — nicht, weil sie „besser” ist, sondern weil Millionen Designer sie täglich nutzen. Junge Designer, die 2027 ihre ersten Websites bauen, lernen von AI-generierten Vorlagen. Ihre ästhetischen Referenzen: Tailwind-Farben, 0.5rem-Spacing, System-Fonts.
Für Schweizer Agenturen bedeutet das:
- Differenzierung wird schwieriger — wenn alle die gleichen Tools nutzen, braucht es bewusste Abweichung, um aufzufallen.
- Design-Kompetenz verschiebt sich — von „Wie baue ich ein schönes Interface?” zu „Wie steuere ich AI-Tools, damit sie MEINE Designsprache sprechen?”
- Die Schere öffnet sich — Agenturen, die AI-Defaults übernehmen, werden Commodity. Agenturen, die AI-Tools als Startpunkt nutzen und gezielt abweichen, behalten Premium-Pricing.
Die gute Nachricht: AI-Tools sind NICHT deterministisch. Sie treffen Entscheidungen basierend auf Prompts. Wer lernt, Prompts zu schreiben, die von den Defaults abweichen („nutze eine custom 6px-Spacing-Skala statt Tailwind-Defaults”), behält die Kontrolle.
Die schlechte Nachricht: Die meisten Agenturen wissen das noch nicht.
Woran erkennt man ein AI-generiertes Interface?
Drei Signale: (1) Tailwind-typische Spacing-Abstufungen (0.5rem, 1rem, 1.5rem), (2) Indigo/Slate-Farbpaletten (#6366f1, #64748b), (3) serifenlose System-Fonts mit 400/600 font-weight, aber keine custom weights. Menschliche Designer variieren diese Parameter stärker.
Sollten Schweizer Agenturen AI-Design-Tools nutzen oder meiden?
Nutzen — aber bewusst steuern. Wer die Default-Ausgaben von V0 oder Figma Make unverändert übernimmt, produziert austauschbare Websites. Wer die Tools als Startpunkt nutzt und gezielt abweicht (z.B. eigene Farbpalette, custom spacing), kombiniert AI-Geschwindigkeit mit menschlicher Differenzierung.
Welche Schweizer Agenturen setzen AI-Design-Tools bereits produktiv ein?
Zeix (Zürich) nutzt Figma-AI-Plugins für Prototyping, Bitforge (Bern) setzt auf Claude Code für Design-Systeme, Cubetech (Zug) kombiniert WordPress-Workflows mit AI-generierten Komponenten. Die meisten Agenturen testen die Tools intern, bevor sie sie in Kundenprojekte integrieren.
Was bedeutet das für die Zukunft von Webdesign in der Schweiz?
Die Schere öffnet sich: Agenturen, die AI-Tools nur als Effizienz-Hebel nutzen, werden austauschbar. Agenturen, die verstehen, WARUM die Tools bestimmte Entscheidungen treffen (und diese gezielt übersteuern), entwickeln eine neue Form von Design-Leadership — nicht trotz AI, sondern mit ihr.
Quellen & Methodik
Dieser Artikel basiert auf:
- Figma State of the Designer 2026 Report (72% Designers nutzen generative AI, 91% sagen Output-Qualität steigt)
- Neasa Schukat (Medium): „7 Web Design Trends Being Shaped by AI in 2026” (Mai 2026)
- Coalition Technologies: „Web Design Trends 2026 | AI in Web Design”
- BMA Business: „2026 Digital Marketing Trends: What’s Changing in Switzerland” (Deloitte-Studie: 32% Schweizer Firmen AI-ready vs 45% USA)
- Eigene Code-Analyse von 50 V0-generierten Layouts, 30 Figma-Make-Prototypen, 20 Claude-Code-Design-System-Outputs (Juni–Juli 2026)
Die „7 stillen Entscheidungen” stammen aus einer statistischen Analyse von AI-generierten Interfaces — Häufigkeit von Tailwind-Klassen, Farb-Hex-Codes, Spacing-Werten in V0-Outputs. Die Prozentangaben (73% #6366f1 bei „blue primary”) sind gerundet aus Sample-Daten (n=50 Prompts mit „blaue Primärfarbe” an V0).
Stand: 18. Juli 2026, 11:30 UTC.