< Back to blocks

Interactive Elements

Add engaging, interactive elements to your site with animations, user controls, and dynamic content. All blocks are fully accessible, responsive, and performant. Create engaging user experiences without sacrificing performance or accessibility.

Accordion | Tabs | Slider | Counters | Image Accordion | Scroll Accordion | Flip Card | Reveal | Countdown | Scrolling Gallery

Accordion

Collapsible content sections for FAQs and content organization

Create accessible accordion sections that expand and collapse to reveal content. Perfect for FAQs, feature lists, and organizing large amounts of content in a compact space.

Flexible behavior – Allow single or multiple open panels

Initial state control – Start with none, first, or all items open

Custom icons – Choose from chevron, plus-minus, caret, or no icon

Icon positioning – Place icons on left or right

Hover effects – Custom hover colors for headers

Open state styling – Different colors for active items

Keyboard navigation – Full keyboard and screen reader support

Open state styling – Different colors for active items

Borders and spacing – Control borders between items and spacing

Demo

Add as many items as you want

Tabs

Tabbed content with icons, deep linking, and responsive modes

Organize content into tabbed panels with smooth transitions. Features horizontal and vertical orientations, icon support, and automatic conversion to accordion on mobile.

Orientation options – Horizontal or vertical tab layout

Tab alignment – Left, center, right, or justified

Multiple styles – Default, pills, underline, or minimal

Icon support – Add icons to tab labels

Deep linking – Direct URLs to specific tabs

Mobile responsive – Auto-converts to accordion or dropdown on mobile

Custom colors – Full control over active and inactive states

Smooth transitions – Animated content switching

Demo – Horizontal

Demo – Vertical

Slider

Modern carousel with multiple effects and auto-play

Create engaging slideshows with various transition effects, navigation controls, and responsive behavior. Supports any WordPress blocks inside slides.

Multiple effects – Slide, fade, cube, flip, and more

Responsive slides – Different slide counts per device

Navigation controls – Arrows and dot indicators with custom styling

Auto-play – Automatic rotation with pause on hover

Loop mode – Continuous infinite loop

Touch/swipe – Mobile-friendly touch gestures

Free mode – Momentum-based scrolling

Centered slides – Highlight active slide in center

Custom height – Fixed height or aspect ratio

Demo

Counter

Animated number counter for stats and metrics

Display animated counting numbers that trigger when scrolled into view. Perfect for showcasing impressive statistics and key metrics.

Scroll-triggered animation – Counts when visible

Custom duration – Control animation speed

Number formatting – Add prefixes, suffixes, decimals

Easing functions – Various animation curves

Icon support – Pair with icons

Styling control – Full typography and color options

Demo

0
Happy Customers
0
Revenue Generated
0
Uptime

Image Accordion

Image panels that expand on hover

Create an engaging image accordion where panels expand to reveal full images on hover or click. Perfect for showcasing multiple images in a compact space.

Smooth transitions – Fluid expansion animations

Hover or click – Choose interaction method

Responsive – Adapts to mobile with stacking

Text overlays – Add titles and descriptions

Custom ratios – Control expanded/collapsed width

Vertical or horizontal – Multiple layout options

Demo

Title Here

Add any blocks to the slider

Title Here

Add any blocks to the slider

Title Here

Add any blocks to the slider

Scroll Accordion

Accordion that opens based on scroll position

Unique accordion variant that automatically opens items as you scroll past them, creating an engaging storytelling experience.

Scroll-triggered – Opens automatically on scroll

Smooth animations – Fade and expand effects

Sticky headers – Optional sticky positioning

Progress tracking – Visual scroll progress

Full control – Override with manual controls

Demo

Design Systems

Build consistent, scalable interfaces with reusable components and design tokens.

Component Library

Pre-built, accessible components that work seamlessly together for rapid development.

Launch & Scale

Deploy with confidence and scale effortlessly with performance-optimized architecture.

Flip Card

Two-sided card with 3D flip animation

Create cards that flip to reveal content on the back. Perfect for team members, services, or any content that benefits from a reveal interaction.

3D flip effect – Smooth perspective animation

Hover or click – Choose flip trigger

Multiple directions – Flip horizontal or vertical

Background images – Full background support on both sides

Custom height – Control card dimensions

Any content – Use any blocks on front and back

Demo

✨ Discover More

Hover to reveal amazing content

🚀 Ready to Start?

Add your own content here using any WordPress blocks. Customize colors, add images, buttons, and more!

✨ Discover More

Hover to reveal amazing content

🚀 Ready to Start?

Add your own content here using any WordPress blocks. Customize colors, add images, buttons, and more!

✨ Discover More

Hover to reveal amazing content

🚀 Ready to Start?

Add your own content here using any WordPress blocks. Customize colors, add images, buttons, and more!

Reveal

Content that reveals on scroll or hover

Add engaging reveal animations that trigger when elements come into view or on hover.

Multiple animations – Fade, slide, zoom, and more

Scroll or hover – Choose trigger method

Stagger support – Animate children in sequence

Custom delays – Control timing

Performance optimized – Uses Intersection Observer

Demo

Countdown Timer

Live countdown to a specific date and time

Display a countdown to important dates with customizable styling and time units.

Target date/time – Set any future date

Multiple units – Days, hours, minutes, seconds

Auto-format – Removes empty units

Expiry action – Show message or hide on completion

Custom styling – Full typography and color control

Timezone support – Accurate across timezones

Demo

00
Days
00
Hours
00
Min
00
Sec