CSS-Grid-Generator
Erstelle CSS Grid-Layouts visuell. Definiere Spalten, Zeilen, Abstände und Templates. Kopiere den CSS-Code. Kostenlos, 100% in deinem Browser.
Vorschau
CSS-Ausgabe
Referenz
Was ist CSS Grid?
CSS Grid ist ein zweidimensionales Layout-System, mit dem Inhalte in Zeilen und Spalten gleichzeitig angeordnet werden können. Es eignet sich ideal für komplexe Seitenlayouts und Komponentenraster.
Grid-Templates
grid-template-columns und grid-template-rows definieren die Struktur des Rasters. Verwende feste Werte (200px), flexible Anteile (1fr) oder die Funktion repeat() für sich wiederholende Muster. auto passt die Größe automatisch an den Inhalt an.
Datenschutz
Alle Verarbeitung läuft 100% in deinem Browser. Es werden keine Daten an Server gesendet.