Hilfe
Fragen und Antworten
Kurze Antworten auf das, was beim Start mit dem Kit am häufigsten gefragt wird. Jede verweist auf die Seite mit den Details.
Auf dieser Seite
Einrichtung#
Brauche ich Astro?
Nein. Components sind React-Dateien mit Tailwind 4. aiw new legt ein Astro-Projekt an, getestet ist das Kit außerdem in Next.js und Vite.
InstallationGeht es ohne Tailwind?
Die Components sind mit Tailwind 4 gebaut und lesen ihre Farben aus den Tokens in kit.css. Tailwind gehört deshalb ins Projekt.
kit.css einbindenBrauche ich die CLI?
Für Copy & Paste nicht. Die CLI löst Abhängigkeiten auf, hält Versionen fest und verbindet deinen KI-Assistenten, das spart bei mehreren Components viel Handarbeit.
Die aiw CLIBrauche ich einen KI-Assistenten?
Nein. Jede Component funktioniert ohne KI. Ein Assistent wie Claude, Cursor, GitHub Copilot oder Codex ist ein schneller Weg, ganze Seiten aus Components zu bauen.
Mit KI-Assistenten bauenComponents auswählen#
Welche Components brauche ich für meine Website?
Der Wegweiser nennt für zehn häufige Arten von Websites eine bewährte Auswahl, von der SaaS-Landingpage über Arztpraxis und Shop bis zur Creator-Seite.
Was im Kit stecktWelche Component für ein Anfrageformular?
Für eine kurze Nachricht reicht contact. Für Angebote nimm request-quote, für Termine booking-request, für Rückrufe callback-request und für längere Anfragen multi-step-form.
FormulareWelches Diagramm passt zu meinen Zahlen?
Ein Verlauf über die Zeit wird eine Linie, ein Vergleich von Kategorien ein Balken, der Weg vom Start- zum Endwert ein Wasserfall und ein einzelner Wert vor seiner Skala ein Gauge.
DiagrammeScroll-Geschichte oder Scroll-Effekt?
Eine Scroll-Geschichte erzählt über mehrere Bildschirme und trägt die wichtigste Aussage einer Seite. Ein Scroll-Effekt ist kurz und macht einen Übergang oder eine Überschrift unverwechselbar.
Scroll-GeschichtenWelche Component für einen KI-Chat auf meiner Website?
chat-widget sitzt als Knopf in der Ecke jeder Seite, mit Übergabe an dein Team. ai-chat ist das volle Chatfenster für eine App.
KI-OberflächenArbeiten mit Components#
Darf ich Components ändern?
Ja. Jede Component liegt als Quellcode in deinem Projekt und gehört dir. Kleine Anpassungen gehen über className, alles Weitere direkt in der Datei.
AnpassenDarf ich die Components in Kundenprojekten nutzen?
Ja. Kit und CLI stehen unter der MIT-Lizenz. Du nutzt die Components frei in eigenen Projekten und für Kunden, auch kommerziell, der Lizenzhinweis bleibt beim Code.
LizenzenÜberschreibt ein Update meine Änderungen?
Nein. aiw update erkennt geänderte Dateien am Lockfile und lässt sie stehen. Nur mit --force werden auch sie ersetzt.
Versionen und UpdatesFunktioniert die Seite ohne JavaScript?
Ja. Components rendern auf dem Server vollständig, jeder Inhalt ist lesbar. Mit JavaScript kommen Bewegung und Interaktion dazu.
BarrierefreiheitWie finde ich die passende Variante?
Auf der Seite jeder Kategorie stehen alle Varianten mit Live-Vorschau in drei Breiten. Im Terminal zeigt aiw components <kategorie> dasselbe mit Install-Zeile.
ComponentsAussehen und Sprache#
Gibt es einen hellen Modus?
Ja. Ohne Klasse ist alles hell, class="dark" am html-Element schaltet auf dunkel. Das Kit startet dunkel, beide Modi sind gleich gründlich gestaltet.
Dark Mode als StandardKann ich meine Markenfarbe nutzen?
Ja. aiw theme macht aus deiner Farbe einen Akzent für hell und dunkel, von Hand sind es zwei Tokens je Modus.
Eigene MarkenfarbeWelche Sprachen sind eingebaut?
Deutsch und Englisch für alle Texte, die eine Component selbst schreibt. Jede weitere Sprache gibst du über labels mit. Deine Inhalte kommen immer über Props.
Sprache und labelsWoher kommen Icons und Schrift?
Die Icons sind für das Kit gezeichnet. Die Schrift ist SF Pro Display auf Apple-Geräten und sonst Inter, selbst gehostet.
Icons