Low Stock Card

Scarcity card with a giant ONLY 6 LEFT numeral and urgency meter — swap product photo, count, name, note and accent.

Type: Image
Format: Instagram Post · 1:1
Orientation: Square

Variablesphoto

Free template · opens in the editor, no account required.

Customize Low Stock Card

Low Stock Card is a ready-to-render E-commerce image design formatted for Instagram Post · 1:1 and support for variables, photo. Open it in the editor to replace its copy and media, then render variations through the Zvid API.

13 variables: Every value below is a variable you can override — send them in the variables field of the render request (or edit them in the editor) to generate on-brand versions at scale.

eyebrowText

ALMOST GONE

onlyWordText

ONLY

countText

unitLabelText

LEFT IN STOCK

productNameText

Ridge Leather Weekender

urgencyNoteText

This colourway won't be restocked once it's gone.

meterLabelText

SELLING FAST

ctaLabelText

Grab yours now

bgColorColor

#111014

accentColorColor

#FF4438

textColorColor

#F4F1F2

mutedColorColor

#8B868F

productImageMedia URL

pexels-photo-7692459.jpeg

The exact JSON payload

This is the full render config — POST it to the API, or open it in the editor to tweak.

Open in editor ↗

{
  "type": "image",
  "name": "img-ecom-low-stock",
  "resolution": "instagram-post",
  "outputFormat": "png",
  "backgroundColor": "#111014",
  "variables": {
    "eyebrow": "ALMOST GONE",
    "onlyWord": "ONLY",
    "count": "6",
    "unitLabel": "LEFT IN STOCK",
    "productName": "Ridge Leather Weekender",
    "urgencyNote": "This colourway won't be restocked once it's gone.",
    "meterLabel": "SELLING FAST",
    "ctaLabel": "Grab yours now",
    "bgColor": "#111014",
    "accentColor": "#FF4438",
    "textColor": "#F4F1F2",
    "mutedColor": "#8B868F",
    "productImage": "https://images.pexels.com/photos/7692459/pexels-photo-7692459.jpeg?auto=compress&cs=tinysrgb&w=1600"
  },
  "visuals": [
    {
      "type": "SVG",
      "width": 1080,
      "height": 1080,
      "position": "center-center",
      "track": 0,
      "svg": "<svg width='1080' height='1080' viewBox='0 0 1080 1080' xmlns='http://www.w3.org/2000/svg'><defs><radialGradient id='g' cx='0.16' cy='0.42' r='0.7'><stop offset='0' stop-color='#FF4438' stop-opacity='0.24'/><stop offset='1' stop-color='#FF4438' stop-opacity='0'/></radialGradient></defs><rect width='1080' height='1080' fill='{{bgColor}}'/><rect width='1080' height='1080' fill='url(#g)'/><rect x='40' y='40' width='1000' height='1000' rx='40' fill='none' stroke='#FFFFFF' stroke-opacity='0.08' stroke-width='1.5'/></svg>"
    },
    {
      "type": "IMAGE",
      "src": "{{productImage}}",
      "x": 600,
      "y": 170,
      "width": 392,
      "height": 740,
      "anchor": "top-left",
      "radius": {
        "tl": 34,
        "tr": 34,
        "bl": 34,
        "br": 34
      },
      "track": 2
    },
    {
      "type": "TEXT",
      "x": 90,
      "y": 188,
      "width": 470,
      "anchor": "top-left",
      "track": 4,
      "text": "{{eyebrow}}",
      "style": {
        "fontFamily": "Space Grotesk",
        "fontSize": "23px",
        "fontWeight": "700",
        "letterSpacing": "0.28em",
        "color": "#FF4438"
      }
    },
    {
      "type": "TEXT",
      "x": 84,
      "y": 214,
      "width": 490,
      "anchor": "top-left",
      "track": 4,
      "style": {
        "fontFamily": "Anton"
      },
      "html": "<div style='color:{{textColor}}; text-transform:uppercase;'><div style='font-size:76px; line-height:0.95; letter-spacing:0.02em;'>{{onlyWord}}</div><div style='font-size:300px; line-height:0.82; letter-spacing:-0.02em; color:{{accentColor}};'>{{count}}</div><div style='font-size:58px; line-height:1.0; letter-spacing:0.01em;'>{{unitLabel}}</div></div>"
    },
    {
      "type": "TEXT",
      "x": 90,
      "y": 636,
      "width": 470,
      "anchor": "top-left",
      "track": 4,
      "style": {
        "fontFamily": "Space Grotesk"
      },
      "html": "<div style='font-size:34px; font-weight:700; letter-spacing:-0.01em; color:{{textColor}};'>{{productName}}</div>"
    },
    {
      "type": "TEXT",
      "x": 90,
      "y": 690,
      "width": 470,
      "anchor": "top-left",
      "track": 4,
      "text": "{{urgencyNote}}",
      "style": {
        "fontFamily": "Space Grotesk",
        "fontSize": "22px",
        "fontWeight": "400",
        "lineHeight": "1.45",
        "color": "#8B868F"
      }
    },
    {
      "type": "TEXT",
      "x": 90,
      "y": 780,
      "width": 470,
      "anchor": "top-left",
      "track": 4,
      "text": "{{meterLabel}}",
      "style": {
        "fontFamily": "Space Grotesk",
        "fontSize": "17px",
        "fontWeight": "700",
        "letterSpacing": "0.16em",
        "color": "#FF4438"
      }
    },
    {
      "type": "SVG",
      "x": 90,
      "y": 808,
      "width": 470,
      "height": 12,
      "anchor": "top-left",
      "track": 4,
      "svg": "<svg width='470' height='12' viewBox='0 0 470 12' xmlns='http://www.w3.org/2000/svg'><rect width='470' height='12' rx='6' fill='#FFFFFF' fill-opacity='0.1'/><rect width='94' height='12' rx='6' fill='{{accentColor}}'/></svg>"
    },
    {
      "type": "SVG",
      "x": 90,
      "y": 856,
      "width": 340,
      "height": 66,
      "anchor": "top-left",
      "track": 4,
      "svg": "<svg width='340' height='66' viewBox='0 0 340 66' xmlns='http://www.w3.org/2000/svg'><rect width='340' height='66' rx='33' fill='{{accentColor}}'/><text x='34' y='41' font-family='Space Grotesk, Arial' font-size='21' font-weight='600' fill='#111014' letter-spacing='0.02em'>{{ctaLabel}}</text><path d='M292 33 L310 33 M303 26 L310 33 L303 40' fill='none' stroke='#111014' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/></svg>"
    }
  ]
}