Basic widget
Image Box
An image with a title, a short text and a link — for services, teams and teasers.
Build it with your AI
“Add three image boxes for our services with a title, a short text and a link each.”
Live demo
See it working
Brand systems
Colors, type and buttons your whole team — and your AI — can use.
Website templates
Headers, footers and post layouts for every part of the site.
Campaign popups
Offers and signups that appear at the right moment.
Settings
37 settings in three tabs
Every setting below is in the editor — and available to your AI through get_widget_schema.
Content
13 settings
Image box
Image
Alt text
Resolution
Title
Description
Title HTML tag
Link
Clickable area
Link text
Link icon
Image position
Vertical alignment
Alignment
Design
24 settings
Box
Padding
Border radius
Hover effect
Lift distance
Transition (ms)
Background
Border
Shadow
Border color
Image
Width
Aspect ratio
Focal point
Border radius
Border
Shadow
Spacing
CSS filters
Hover animation
Zoom scale
Content
Content padding
Typography
Color
Hover color
Spacing
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 Image Box settings over MCP and writes the element for you — real, editable and on brand.
Claude · connected to your site
You
Add three image boxes for our services with a title, a short text and a link each.
Claude · using Uncoder
Done — it’s on your site and fully editable.
What the AI writes
{
"type": "image-box",
"settings": {
"image": { "id": 39 },
"title": "Brand systems",
"description": "Colors, type and buttons your whole team — and your AI — can use.",
"link": { "url": "/features/" }
}
}More basic widgets
Works well with
Alert
A friendly notice for news, warnings and success messages.
Blockquote
A quote that stands out, with its author and source.
Button
A link that looks like a button, in your Design System’s styles: primary, secondary, outline, ghost or link.
Counter
A number that counts up when it scrolls into view — and stays readable for search engines.
Divider
A line between sections, plain or with a word or icon in the middle.
Heading
Titles from h1 to h6, sized by your text styles, with a second font for words in italics.