Animated, GSAP-powered blocks for engaging, scannable content sections.
Accordion #
Build animated FAQ sections and multi-section content areas that are easy to scan.
Unfolds content with sleek, interactive panels powered by GSAP animations. Fully responsive and editable directly in the block editor, with no custom code required.
Key features #
- Unlimited collapsible panels
- Smooth GSAP open/close animation
- Fully responsive layout
Best for #
FAQ sections, service breakdowns, multi-topic content areas.
View live demo: https://gutenblocks.com/accordion/
Tabbed Content #
Organize content into tabbed interfaces with smooth GSAP transitions between panels.
Lets visitors switch between content panels (Features, Pricing, FAQ, etc.) with a single click, keeping long pages compact and scannable.
Key features #
- Add/remove/reorder tabs from the block toolbar
- Horizontal and vertical tab layouts
- Smooth animated tab transitions
- Customizable colors, fonts and spacing
Best for #
Feature/pricing/FAQ groupings, product spec sheets.
View live demo: https://gutenblocks.com/tabbed-content/
Content Switcher #
A pill-style toggle for switching between two distinct content states in one area.
A compact pill-shaped toggle for flipping between two states of content in the same space, such as Monthly vs Yearly pricing or Before vs After.
Key features #
- Two-state pill toggle control
- Smooth state transition
Best for #
Monthly/yearly pricing toggles, comparison views.
View live demo: https://gutenblocks.com/content-switcher-block/
Card Slider #
A scroll-animated card row for showcasing services, content, features or portfolio items.
A horizontally scrolling row of cards with scroll-linked animation, useful for showcasing multiple items without consuming excessive vertical space.
Key features #
- Scroll-animated horizontal card row
- Works for services, portfolio items, or content cards
Best for #
Service showcases, portfolio highlights, agency case studies.
View live demo: https://gutenblocks.com/card-slider/
Timeline #
Showcase milestones, history, project steps or a clean process timeline.
Presents a sequence of steps or milestones (e.g. “How It Works”) as a clean numbered timeline, with an optional slider/carousel presentation with next/previous controls.
Key features #
- Numbered step layout with heading + description per step
- Optional carousel navigation (next/previous arrows)
- Eyebrow label and section heading
Best for #
Company history, onboarding steps, process explanations.
View live demo: https://gutenblocks.com/timeline/
Gallery #
A responsive image gallery with support for up to eight images on the free tier.
A responsive image gallery block for showcasing photos, portfolio work or product shots, supporting up to eight images in the free tier.
Key features #
- Up to 8 images (free tier)
- Responsive grid layout
Best for #
Portfolio pages, project galleries, product photo grids.
View live demo: https://gutenblocks.com/gallery-block/
Video Player #
Embed YouTube videos with a clean, lightweight player design.
A lightweight embed block for YouTube videos with a clean player frame, avoiding the visual clutter of default embeds.
Key features #
- YouTube embed support
- Clean, minimal player chrome
Best for #
Product demo videos, testimonials, tutorial embeds.
View live demo: https://gutenblocks.com/video-player-block/
Icon Box #
Display an icon with customizable styling, powered by a large UXWing icon library.
Pairs an icon with a heading and description, drawing from the large UXWing icon library, with full style customization.
Key features #
- Large built-in icon library (UXWing)
- Customizable icon size, color and background
Best for #
Feature callouts, service highlights, benefit lists.