Zvid Ad
Product-style promo with text overlays and music.
- Type
- Video
- Format
- HD · 16:9
- Orientation
- Landscape
- Duration
- 14s
- Render cost
- $0.0035 / render
Open in editor
Free template · opens in the editor, no account required.
Customize Zvid Ad
Zvid Ad is a ready-to-render Other video design formatted for HD · 16:9. Open it in the editor to replace its copy and media, then render variations through the Zvid API.
The exact JSON payload
This is the full render config — POST it to the API, or open it in the editor to tweak.
{
"name": "zvid-ad",
"resolution": "hd",
"duration": 14,
"frameRate": 30,
"backgroundColor": "#0b0614",
"visuals": [
{
"type": "SVG",
"width": 1280,
"height": 720,
"svg": "<svg width='1280' height='720' viewBox='0 0 1280 720' xmlns='http://www.w3.org/2000/svg'><defs><linearGradient id='bg' x1='0' y1='0' x2='1' y2='1'><stop offset='0' stop-color='#0b0614'/><stop offset='1' stop-color='#1a1031'/></linearGradient><radialGradient id='glow1' cx='0' cy='0' r='1' gradientUnits='userSpaceOnUse' gradientTransform='translate(1040 120) rotate(90) scale(260)'><stop stop-color='#a955f7' stop-opacity='0.30'/><stop offset='1' stop-color='#a955f7' stop-opacity='0'/></radialGradient><radialGradient id='glow2' cx='0' cy='0' r='1' gradientUnits='userSpaceOnUse' gradientTransform='translate(210 600) rotate(90) scale(300)'><stop stop-color='#fadd46' stop-opacity='0.18'/><stop offset='1' stop-color='#fadd46' stop-opacity='0'/></radialGradient></defs><rect width='1280' height='720' fill='url(#bg)'/><rect x='36' y='36' width='1208' height='648' rx='36' fill='rgba(255,255,255,0.03)' stroke='rgba(255,255,255,0.08)'/><circle cx='1040' cy='120' r='260' fill='url(#glow1)'/><circle cx='210' cy='600' r='300' fill='url(#glow2)'/></svg>",
"track": 0
},
{
"type": "SVG",
"x": 1020,
"y": 120,
"width": 240,
"height": 240,
"anchor": "center-center",
"opacity": 0.65,
"track": 1,
"enterBegin": 0,
"enterEnd": 1,
"enterAnimation": "fade",
"exitBegin": 4.2,
"exitEnd": 4.8,
"exitAnimation": "fade",
"svg": "<svg width='240' height='240' viewBox='0 0 240 240' xmlns='http://www.w3.org/2000/svg'><circle cx='120' cy='120' r='88' fill='none' stroke='rgba(169,85,247,0.28)' stroke-width='2'/><circle cx='120' cy='120' r='58' fill='none' stroke='rgba(250,221,70,0.22)' stroke-width='2'/><circle cx='120' cy='120' r='6' fill='#fadd46'/><circle cx='32' cy='120' r='4' fill='#ffffff' opacity='0.8'/><circle cx='208' cy='120' r='4' fill='#ffffff' opacity='0.5'/><circle cx='120' cy='32' r='4' fill='#ffffff' opacity='0.6'/><circle cx='120' cy='208' r='4' fill='#ffffff' opacity='0.4'/></svg>"
},
{
"type": "TEXT",
"x": 640,
"y": 238,
"width": 980,
"anchor": "center-center",
"track": 7,
"enterBegin": 0.5,
"enterEnd": 1.2,
"enterAnimation": "fade",
"exitBegin": 4.2,
"exitEnd": 4.8,
"exitAnimation": "fade",
"html": "<div style='text-align:center; color:#ffffff; font-family:Poppins; font-size:58px; font-weight:700; line-height:1.08; letter-spacing:-1px;'>Your data. Your brand.<br><span style='color:#fadd46;'>Instant videos.</span></div>"
},
{
"type": "TEXT",
"x": 640,
"y": 352,
"width": 980,
"anchor": "center-center",
"track": 8,
"enterBegin": 0.9,
"enterEnd": 1.6,
"enterAnimation": "fade",
"exitBegin": 4.1,
"exitEnd": 4.8,
"exitAnimation": "fade",
"html": "<div style='text-align:center; color:#cfc3ea; font-size:24px; font-weight:500; line-height:1.5;'>Create product promos, offers, and announcements<br><span style='color:#fadd46; font-weight:700;'>automatically</span> for every campaign and every channel.</div>"
},
{
"type": "TEXT",
"x": 640,
"y": 462,
"width": 900,
"anchor": "center-center",
"track": 9,
"enterBegin": 1.3,
"enterEnd": 2,
"enterAnimation": "fade",
"exitBegin": 4,
"exitEnd": 4.7,
"exitAnimation": "fade",
"html": "<div style='text-align:center; color:#9f8bcf; font-size:18px; line-height:1.5;'>From one creative system to thousands of polished brand-safe videos.</div>"
},
{
"type": "TEXT",
"x": 640,
"y": 112,
"width": 1080,
"anchor": "center-center",
"track": 10,
"enterBegin": 4.6,
"enterEnd": 5.2,
"enterAnimation": "fade",
"exitBegin": 10.2,
"exitEnd": 10.8,
"exitAnimation": "fade",
"html": "<div style='text-align:center; color:#ffffff; font-family:Poppins; font-size:40px; font-weight:700; line-height:1.2;'>Turn structured content into<br><span style='color:#fadd46;'>high-performing video creative</span></div>"
},
{
"type": "SVG",
"x": 305,
"y": 390,
"width": 370,
"height": 300,
"anchor": "center-center",
"track": 2,
"enterBegin": 5,
"enterEnd": 5.6,
"enterAnimation": "smoothleft",
"exitBegin": 10.1,
"exitEnd": 10.7,
"exitAnimation": "fade",
"svg": "<svg width='370' height='300' viewBox='0 0 370 300' xmlns='http://www.w3.org/2000/svg'><defs><linearGradient id='cardL' x1='0' y1='0' x2='1' y2='1'><stop offset='0' stop-color='rgba(255,255,255,0.10)'/><stop offset='1' stop-color='rgba(255,255,255,0.04)'/></linearGradient></defs><rect x='0.5' y='0.5' width='369' height='299' rx='28' fill='url(#cardL)' stroke='rgba(255,255,255,0.14)'/><rect x='24' y='26' width='112' height='30' rx='15' fill='rgba(250,221,70,0.12)' stroke='rgba(250,221,70,0.35)'/><text x='80' y='46' text-anchor='middle' fill='#fadd46' font-size='14' font-family='Inter' font-weight='700'>Catalog Data</text><rect x='24' y='78' width='322' height='38' rx='14' fill='rgba(255,255,255,0.06)' stroke='rgba(255,255,255,0.04)'/><rect x='24' y='128' width='322' height='38' rx='14' fill='rgba(255,255,255,0.06)' stroke='rgba(255,255,255,0.04)'/><rect x='24' y='178' width='322' height='38' rx='14' fill='rgba(255,255,255,0.06)' stroke='rgba(255,255,255,0.04)'/><rect x='24' y='228' width='220' height='38' rx='14' fill='rgba(255,255,255,0.06)' stroke='rgba(255,255,255,0.04)'/></svg>"
},
{
"type": "SVG",
"x": 640,
"y": 392,
"width": 220,
"height": 180,
"anchor": "center-center",
"track": 4,
"enterBegin": 5.3,
"enterEnd": 5.9,
"enterAnimation": "fade",
"exitBegin": 10,
"exitEnd": 10.6,
"exitAnimation": "fade",
"svg": "<svg width='220' height='180' viewBox='0 0 220 180' xmlns='http://www.w3.org/2000/svg'><defs><linearGradient id='flow' x1='0' y1='0' x2='1' y2='0'><stop offset='0' stop-color='#a955f7'/><stop offset='1' stop-color='#fadd46'/></linearGradient></defs><path d='M20 90 H200' stroke='url(#flow)' stroke-width='6' stroke-linecap='round' opacity='0.85'/><circle cx='54' cy='90' r='15' fill='rgba(169,85,247,0.18)' stroke='rgba(169,85,247,0.5)'/><circle cx='110' cy='90' r='15' fill='rgba(255,255,255,0.08)' stroke='rgba(255,255,255,0.28)'/><circle cx='166' cy='90' r='15' fill='rgba(250,221,70,0.16)' stroke='rgba(250,221,70,0.5)'/><rect x='32' y='36' width='44' height='20' rx='10' fill='rgba(169,85,247,0.18)'/><text x='54' y='50' text-anchor='middle' fill='#ffffff' font-size='11' font-family='Inter' font-weight='700'>DATA</text><rect x='88' y='122' width='44' height='20' rx='10' fill='rgba(255,255,255,0.10)'/><text x='110' y='136' text-anchor='middle' fill='#ffffff' font-size='11' font-family='Inter' font-weight='700'>JSON</text><rect x='144' y='36' width='44' height='20' rx='10' fill='rgba(250,221,70,0.18)'/><text x='166' y='50' text-anchor='middle' fill='#ffffff' font-size='11' font-family='Inter' font-weight='700'>VIDEO</text></svg>"
},
{
"type": "SVG",
"x": 972,
"y": 390,
"width": 410,
"height": 316,
"anchor": "center-center",
"track": 3,
"enterBegin": 5.2,
"enterEnd": 5.8,
"enterAnimation": "smoothright",
"exitBegin": 10.1,
"exitEnd": 10.7,
"exitAnimation": "fade",
"svg": "<svg width='410' height='316' viewBox='0 0 410 316' xmlns='http://www.w3.org/2000/svg'><defs><linearGradient id='cardR' x1='0' y1='0' x2='1' y2='1'><stop offset='0' stop-color='rgba(255,255,255,0.10)'/><stop offset='1' stop-color='rgba(255,255,255,0.04)'/></linearGradient><linearGradient id='screen' x1='0' y1='0' x2='1' y2='1'><stop offset='0' stop-color='#2a184b'/><stop offset='1' stop-color='#120a23'/></linearGradient></defs><rect x='0.5' y='0.5' width='409' height='315' rx='28' fill='url(#cardR)' stroke='rgba(255,255,255,0.14)'/><rect x='24' y='24' width='362' height='206' rx='20' fill='url(#screen)' stroke='rgba(255,255,255,0.10)'/><rect x='42' y='42' width='146' height='128' rx='16' fill='rgba(255,255,255,0.08)'/><circle cx='115' cy='106' r='24' fill='rgba(255,255,255,0.16)'/><path d='M107 94 L129 106 L107 118 Z' fill='rgba(255,255,255,0.75)'/><rect x='206' y='48' width='146' height='18' rx='9' fill='rgba(255,255,255,0.10)'/><rect x='206' y='80' width='120' height='14' rx='7' fill='rgba(250,221,70,0.22)'/><rect x='206' y='110' width='108' height='14' rx='7' fill='rgba(169,85,247,0.24)'/><rect x='206' y='140' width='132' height='14' rx='7' fill='rgba(255,255,255,0.10)'/><rect x='42' y='250' width='114' height='36' rx='18' fill='rgba(169,85,247,0.16)' stroke='rgba(169,85,247,0.35)'/><rect x='170' y='250' width='102' height='36' rx='18' fill='rgba(250,221,70,0.14)' stroke='rgba(250,221,70,0.35)'/><rect x='286' y='250' width='82' height='36' rx='18' fill='rgba(255,255,255,0.08)' stroke='rgba(255,255,255,0.16)'/><text x='99' y='273' text-anchor='middle' fill='#ffffff' font-size='14' font-family='Inter' font-weight='700'>On-brand</text><text x='221' y='273' text-anchor='middle' fill='#ffffff' font-size='14' font-family='Inter' font-weight='700'>Fast edits</text><text x='327' y='273' text-anchor='middle' fill='#ffffff' font-size='14' font-family='Inter' font-weight='700'>Scale</text></svg>"
},
{
"type": "TEXT",
"x": 640,
"y": 604,
"width": 860,
"anchor": "center-center",
"track": 5,
"enterBegin": 5.7,
"enterEnd": 6.3,
"enterAnimation": "fade",
"exitBegin": 10,
"exitEnd": 10.6,
"exitAnimation": "fade",
"html": "<div style='background:rgba(255,255,255,0.05); border:1px solid rgba(255,255,255,0.10); border-radius:27px; padding:14px 18px; text-align:center; white-space:nowrap;'><span style='display:inline-block; width:190px; text-align:center; color:#ffffff; font-size:16px; font-weight:600;'><span style='display:inline-block; width:10px; height:10px; border-radius:999px; background:#fadd46; margin-right:8px; vertical-align:middle;'></span><span style='vertical-align:middle;'>Offers</span></span><span style='display:inline-block; width:190px; text-align:center; color:#ffffff; font-size:16px; font-weight:600;'><span style='display:inline-block; width:10px; height:10px; border-radius:999px; background:#a955f7; margin-right:8px; vertical-align:middle;'></span><span style='vertical-align:middle;'>Brand styling</span></span><span style='display:inline-block; width:190px; text-align:center; color:#ffffff; font-size:16px; font-weight:600;'><span style='display:inline-block; width:10px; height:10px; border-radius:999px; background:#fadd46; margin-right:8px; vertical-align:middle;'></span><span style='vertical-align:middle;'>Localization</span></span><span style='display:inline-block; width:190px; text-align:center; color:#ffffff; font-size:16px; font-weight:600;'><span style='display:inline-block; width:10px; height:10px; border-radius:999px; background:#a955f7; margin-right:8px; vertical-align:middle;'></span><span style='vertical-align:middle;'>Bulk output</span></span></div>"
},
{
"type": "TEXT",
"x": 640,
"y": 228,
"width": 1000,
"anchor": "center-center",
"track": 11,
"enterBegin": 10.6,
"enterEnd": 11.2,
"enterAnimation": "fade",
"html": "<div style='text-align:center; color:#ffffff; font-family:Poppins; font-size:50px; font-weight:700; line-height:1.12; letter-spacing:-1px;'>Launch more campaigns.<br><span style='color:#fadd46;'>Keep every video on-brand.</span></div>"
},
{
"type": "TEXT",
"x": 640,
"y": 350,
"width": 980,
"anchor": "center-center",
"track": 12,
"enterBegin": 10.9,
"enterEnd": 11.5,
"enterAnimation": "fade",
"html": "<div style='text-align:center; color:#d1c5ec; font-size:24px; line-height:1.55;'>Zvid helps SaaS teams, marketplaces, and modern brands turn structured content into compelling video at scale.</div>"
},
{
"type": "TEXT",
"x": 640,
"y": 520,
"anchor": "center-center",
"track": 6,
"enterBegin": 11.2,
"enterEnd": 11.8,
"enterAnimation": "fade",
"html": "<div style='display:flex; align-items:center; justify-content:center; width:100%; height:100%;'><div style='background:rgba(255,255,255,0.04); border:1px solid rgba(255,255,255,0.10); border-radius:30px; padding:22px 16px; text-align:center; display:flex; align-items:center; justify-content:center; gap:14px; flex-wrap:nowrap;'><div style='width:286px; padding:16px 14px 14px; border-radius:24px; background:rgba(169,85,247,0.14); border:1px solid rgba(169,85,247,0.34); text-align:center; flex:0 0 auto;'><div style='font-size:18px; font-weight:700; color:#ffffff; margin-bottom:8px;'>Faster production</div></div><div style='width:286px; padding:16px 14px 14px; border-radius:24px; background:rgba(250,221,70,0.12); border:1px solid rgba(250,221,70,0.34); text-align:center; flex:0 0 auto;'><div style='font-size:18px; font-weight:700; color:#ffffff; margin-bottom:8px;'>Consistent output</div></div><div style='width:286px; padding:16px 14px 14px; border-radius:24px; background:rgba(255,255,255,0.06); border:1px solid rgba(255,255,255,0.14); text-align:center; flex:0 0 auto;'><div style='font-size:18px; font-weight:700; color:#ffffff; margin-bottom:8px;'>Built for scale</div></div></div></div>"
}
]
}More Other templates
View all ↗
Ready to ship video at scale?
Start free — your first render is only a JSON payload away.