Media widget
Lottie
A lightweight vector animation that plays on load, on hover, on click or as visitors scroll.
Build it with your AI
“Add the pulse Lottie animation, playing in a loop, centered above the heading.”
Live demo
See it working
Settings
14 settings in three tabs
Every setting below is in the editor — and available to your AI through get_widget_schema.
Content
11 settings
Lottie
Source
JSON file
JSON URL
Play
Loop
On mouse leave
Speed
Play backwards
Link
Accessible label
Alignment
Design
3 settings
Animation
Width
Max width
Opacity
Behaviour
shared
On every element
Spacing & position
Background & border
Animations
Motion & effects
Scroll & mouse effects
Visibility
Conditions
Interactions
Attributes & CSS
Build it with AI
Just describe what you want
Your AI looks up the Lottie settings over MCP and writes the element for you — real, editable and on brand.
Claude · connected to your site
You
Add the pulse Lottie animation, playing in a loop, centered above the heading.
Claude · using Uncoder
Done — it’s on your site and fully editable.
What the AI writes
{
"type": "lottie",
"settings": {
"file": { "id": 153 },
"trigger": "autoplay",
"loop": true,
"align": "center",
"width": { "size": 220, "unit": "px" },
"label": "A pulsing dot"
}
}More media widgets
Works well with
Facebook Embed
A Facebook page, post or video on your site — loading only when a visitor asks for it.
Google Maps
A map of your address that can wait for a click before loading anything from Google.
Hotspot
An image with pulsing markers that open little tooltips.
Image Carousel
Swipe through images, several per view, with captions and a lightbox.
Before / After
Drag a divider to compare two images: before and after, draft and final.
Image Gallery
Images in a grid, masonry or justified rows, with captions, hover effects and a lightbox.