Zum Inhalt springen
Alle Sections
Sections/

Bento

Bento-Layout, das Inhalte in unterschiedlich großen Kacheln zeigt.

Vorschauen brauchen Platz, Komponenten nicht.
Finish Triptych
Sliding Rows Bento
Field Survey BentoNeu
Continuous Field BentoNeu
Ops Metrics Bento
Feature Mosaic Bento
Persona Profile Bento
Interactive Bento GridNeu
Bento Feature Showcase
Bento Grid Section

Wann ist ein Bento Grid sinnvoll?

Ein Bento Grid zeigt mehrere Inhalte als Kacheln in verschiedenen Größen, so wie eine Bento-Box verschiedene Gerichte trägt. Es passt, wenn du eine Hauptaussage und eine Handvoll Belege hast: Die große Kachel trägt die Aussage, die kleinen ergänzen Details, Zahlen oder Bilder. Die Grids hier reichen von festen Kachel-Layouts bis zu Kacheln, die auf den Cursor reagieren, Reihen, die gleiten, und Kacheln mit Live-Werten.

Nimm vier bis sieben Kacheln. Weniger wirkt leer, mehr wird zum unruhigen Dashboard. Gib jeder Kachel genau eine Aufgabe: eine kurze Aussage, eine Zahl oder ein Bild. Jedes Grid ist responsive, auf dem Handy stapeln sich die Kacheln in ein oder zwei Spalten in einer bewussten Reihenfolge. Jede Section ist eine einzelne React-Datei mit Tailwind-Klassen.

Weitere Section-Kategorien

FAQ

Häufige Fragen

Vier bis sieben. Eine große Kachel für die Hauptaussage, der Rest für Details. Ab acht verliert das Grid seine Rangfolge.

Die Kacheln stapeln sich in ein oder zwei Spalten. Die Reihenfolge folgt der Wichtigkeit, die Hauptkachel steht also oben.

Bento, wenn die Inhalte sich in Gewicht und Form unterscheiden, etwa eine Zahl neben einem Bild. Ein Feature-Raster, wenn alle Punkte gleich wichtig sind, etwa sechs Funktionen mit je einem Icon.

Deine Frage war nicht dabei? Wir helfen gern weiter.

Kontakt aufnehmen