Animated Elements3D Card Effect for GoHighLevel
A card that leans toward the cursor, with every piece of it floating at its own height above the surface: headline nearest, image furthest, buttons riding just above the edge. The whole thing is one hover away from flat.
- Controls
- 99
- Variants shown
- 7
- Dependencies
- None
7 ways to run it
Every one of these is the real element with different settings. Press play again to watch any of them from the start.
99 controls, grouped the way you build
- Card content10
- The tilt & the float9
- The image6
- Link & action13
- Button & action13
- Card layout9
- Animation4
- Text style12
- Content color8
- Card surface8
- Background & spacing7
Everything it does
- Headline with heading role
- description
- image with its own height on desktop and mobile, corners and crop
- text link and button, each with ten click actions and their own fields
- how far the card leans
- depth of field
- how fast it follows
- a separate float height for the headline, description, image and the footer row
- glow on hover with its own colour
- card width, padding and corners on desktop and mobile
- gap between lines and above the footer
- entrance with scroll or load trigger
- card alignment
- font
- headline and description sizes per breakpoint
- link and button text sizes
- letter spacing
- line height
- colours for every part
- button corners and padding
- solid or gradient card with a border
- block padding, background + opacity, radius, border
How it actually behaves
Everything is optional. Headline, description, image, text link and button each have their own switch, and the card re-flows around whatever is left. Turn them all off but the headline and you have a clean title card. Both calls to action carry the full GoHighLevel action list, independently of each other.
How to add 3D Card Effect to a GoHighLevel page
- 01
Open the element panel
In the page builder, click the + button to add a new element.
- 02
Go to Widget Marketplace
In the left menu, select Widget Marketplace.
- 03
Find Animated Elements
Locate the Animated Elements widget by Funnelslayer in the installed apps list.
- 04
Drag and drop it into the page
Drop the widget where you want it. The Web Widget Settings modal opens on the element gallery: "Select an element to start with".
- 05
Select an element and continue
Choose an element (Animated Counter, Typing Animation, and more), then click Continue. Search by name or by what it does, or use the category rail on the left to narrow the list. You can switch elements later without losing your settings.
- 06
Customize it
Use the element's settings to customize everything to match your brand. The live preview updates as you go, with separate desktop and mobile views.
Common questions
- Can I use a card without an image?
- Yes. Every content block has its own switch, and the card re-flows around what is left. Turn off everything but the headline and you have a clean title card.
- Do the card buttons support one-click upsells?
- No. One-click upsells, membership actions and named funnel steps live inside GoHighLevel’s own Button element and cannot be reached by any custom widget. Use a native button for those, and an animated button element in attach mode if you want motion on it.
- Will the glow slow the page down?
- No. The edges are drawn with CSS and canvas inside the widget itself, with no external libraries or network requests. Motion can be set to hover-only or parked entirely if you want the card still at rest.
Electric Border Card
A full-content conversion card with independently optional blocks, complete GHL button actions, and a living two-color electric edge.
Tilted Card
A full-depth image card that tilts toward the cursor, lifts layered overlay copy and follows with a floating label. Ships with a stock photograph in place, swap in a Media Storage link, and a polished cover stands in when there is no image.
Animated Gradient Card
A premium content card with a rotating multi-color border, headline shine, cursor spotlight and a fully configurable GoHighLevel-ready action.