Most service pages, faculty grids, and destination galleries are the same shape: a flat row of square cards that ask the visitor to take a leap of faith. The Flip Box widget for Elementor fixes that by giving each card a second side — clean front, useful back — connected by a smooth flip animation. Sentio designed the Flip Box widget so editors stop hiding details behind extra clicks and start letting visitors discover them with a hover or a tap.
What Is the Flip Box Widget?
The Flip Box widget is a two-sided card you can build entirely inside the Elementor editor. The front holds an image or icon, a headline, and a short description. The back replaces that content with a longer description and a single, focused call-to-action button. Editors pick a flip direction — horizontal, vertical, diagonal, or a soft zoom — and a trigger — hover, click, both, or on-scroll. The Elementor Flip Box animates the transition automatically, and every option lives in one widget instead of three stacked blocks.
Key Features of the Flip Box Widget
- Six flip directions — horizontal-right, horizontal-left, vertical-up, vertical-down, diagonal, and zoom — so the motion matches your design language.
- Four trigger modes — hover, click, both, or on-scroll — including a touch-friendly click mode for mobile-first layouts.
- Magnetic tilt and glassmorphism built in, plus per-card stagger so a grid of flip boxes reveals itself in sequence.
- Fully styled back-side button with hover states, icon position, and typography — no extra button widget required.
Why Use the Flip Box Widget on Your Site?
Flat content blocks ask visitors to read everything at once. The Flip Box widget rewards exploration: the front of the card answers the obvious question, and the back answers the next one. A university admissions page can show three programmes with photo, headline, and one-line summary on the front — then flip to deadlines and a “view curriculum” button on the back. A boutique travel company can let each destination card click to reveal what is included, with a magnetic tilt that signals the card is interactive. A modern art gallery can stack frosted-glass Flip Box tiles for current exhibitions, with the back of each tile carrying tour times and audio-guide links. The Elementor Flip Box is keyboard accessible, screen-reader friendly, and falls back gracefully on browsers without 3D-transform support.
Getting Started With Flip Box in Minutes
Install Sentio Addons, drop the Flip Box widget on any page, and fill in two short sides of content. The Front tab handles the image or icon, title, and description. The Back tab adds the longer description, the button label, and the destination URL. Open Settings to choose a flip direction and trigger mode. The Style tabs let you match brand colours, border radius, padding, typography, and box-shadow on both sides. Duplicate the widget twice inside a flex container to build a clean three-card grid.
See the Flip Box Widget in Action
The widget page above this article shows three distinct examples: a deep-navy university programme grid that flips horizontally on hover, a vibrant pink travel-destination grid that flips vertically on click with magnetic tilt, and a minimal glassmorphism gallery grid that zooms gently on hover. Same widget, same Style tab, three completely different stories told with the same flip.
Interactive cards are no longer a luxury — they are how visitors expect to read a services page, a team page, or a product gallery. Use the Flip Box widget for Elementor and you stop stacking boxes and start designing real moments of discovery. Sentio Addons keeps building practical, design-system-friendly widgets like this because publishing teams need real tools, not toy components.