Getting Started
Jose Tamu
Sep 22, 2025 /
Beginner /
Light

Flipbox

Front Card

Back Heading

How it works

Flipbox is a nestable widget made up of 2 containers: Front and Back.
You can place the content you want at both of them. Visible content must be placed inside “Front” container. Content visible when flipping must be placed at “Back” container.
Front and Back containers styles can be edited right inside Flipbox widget.

Content tab

Animation group

Type: type will determine the flipbox direction. There are 4 types: horizontal, horizontal-reverse, vertical, vertical-reverse. The demo is horizontal-reverse.
Trigger: the event that will trigger the flipbox animation. Hover or click.
Perspective: determines the flip intensity.
Duration
CSS easing: you can set any custom CSS easing of your own. Learn more about CSS easings here.