Interface systems Illustrative Referenz Kopierfertiger LLM-Prompt

Bento Grid

Unterschiedlich große, ausgerichtete Kacheln bündeln Inhalte, Status und Aktionen in einer modularen Übersicht.

Eigenes Projekt-Dashboard als Bento-Raster mit Prioritäts-, Fortschritts-, Aktivitäts- und Teamkacheln.
Eigene illustrative Nachbildung – kein generiertes Ergebnis oder proprietärer Produktscreenshot. Original HTML/CSS illustration

Kopierfertiger LLM-Prompt

Bento Grid: Kopierfertiger LLM-Prompt

Nutze dies als Ausgangsbriefing und passe dann Inhalte, Marke und Interaktionsanforderungen an dein Projekt an.

Design a responsive bento-grid interface using varied tile spans, strict alignment, concise content blocks, and a clear visual hierarchy. Give every tile one primary purpose, use color and scale sparingly, and define hover, focus, selected, loading, empty, and error states. On narrow screens, preserve meaning with a deliberate linear reading order rather than shrinking the desktop grid.

Erkennungsmerkmale

So erkennst du diesen Stil

Unterschiedlich große, ausgerichtete Kacheln bündeln Inhalte, Status und Aktionen in einer modularen Übersicht.

  1. 01 Modulare Kacheln
  2. 02 Variable Größen
  3. 03 Klare Ausrichtung
  4. 04 Kompakte Zusammenfassungen