Skip to content

Bento Grid, 3D Tilt Card and Case-Study Grid

Marketing grids, interactive cards and a filterable portfolio.

On this page
  1. Bento Grid
  2. 3D Tilt Card
  3. Case-Study Grid

Bento Grid

  • Pick a Theme preset and a Layout preset, then Apply Preset.
  • Set columns, row height and gaps. Each cell has a content type, column and row span, alignment and order. Cells can be text, image, stat, quote and more, and you can override spans and order for tablet (up to 900 px) and mobile (up to 640 px).
  • A cell can show a WordPress post instead, with options for source, category, excerpt length and read-more text.
  • Scroll reveal and hover effect.

3D Tilt Card

  • Image, badge, title, description, icon, call to action and an optional link over the whole card.
  • Flip / back face with a hover or click trigger, and its own title, text and call to action.
  • Maximum tilt, hover scale, glare, image overlay, spotlight border glow, holographic foil sheen and mobile gyroscope motion.

Case-Study Grid

  • Projects source: manual entries or your own case-study posts. Each project has a cover image, gallery, sector, scope, budget range, year, client, services, excerpt and detail text.
  • Layout mode, columns, and filter bars for sector, year and service, plus sorting.
  • NDA mode: hide the budget and the client name.
  • Card click action: open a modal with a lightbox gallery, or link out. A “Discuss this project” button can open your form or dock.
  • Initially visible cards and a load-more chunk size.

After updating to Case-Study Grid 1.5.0, purge your page, CDN and object cache once, so cached pages pick up the new signed token. Otherwise Load more and filters may stop working.

Find your product