Choose how menu items are displayed: List, Grid, Cards, or Compact.
4 minRioxly offers five card layout options, each designed for different menu styles and screen sizes:
List — Single-column rows. Best for menus with long item descriptions. Each item gets a full row with a small thumbnail, name, description, and price. The most readable layout for text-heavy menus.
Grid 2 — Two-column grid. A good balance between visual appeal and information density. Item cards show a photo on top with the name and price below. Works well on both desktop and mobile.
Grid 3 — Three-column grid. More compact than Grid 2, ideal for menus with many items and strong photography. Best on larger screens; automatically adjusts to 2 columns on mobile.
Cards — Large card layout. Each item gets a wide horizontal card with the photo on the left and details on the right. Premium look, best for small-to-medium menus with great photos.
Compact — Dense minimal list. No images, just item names and prices with subtle separators. Ideal for quick-service restaurants, bars, or menus with 50+ items where scanning speed matters.
Consider your menu size and photography quality. If you have professional food photos, Grid 2 or Cards will showcase them best. If you have 50+ items, List or Compact keeps things scannable.
You can switch layouts at any time from the Design Studio — the preview updates instantly so you can compare.
💡 Tip: The layout you choose affects mobile display. Grid 3 automatically drops to 2 columns on phones. List and Compact work equally well on all screen sizes.
Below the layout picker, you'll find additional styling controls: Card Radius (rounded corners, 0–32px), Spacing (gap between cards, 4–32px), Shadow (None, Subtle, Medium, Bold), and Card Borders (on/off).
These settings work with any layout. Experiment with different combinations — subtle shadow with rounded corners and no borders creates a modern, floating card effect.