app-share-achievement

App share achievement OG image template

The card an app offers after a workout or a lesson: route or cover picture, the activity, up to four metrics with dividers, a streak of dots and a badge stamped over the picture.

Use this template — start free Read the docs
App share achievement Open Graph image template rendered by Shareglint
App share achievement template at square size (1080×1080)
App share achievement template at portrait size (1080×1350)
App share achievement template at story size (1080×1920)
App share achievement template at pinterest size (1000×1500)
App share achievement template at youtube size (1280×720)

These are real renders from the API with the example values in the table below. Switch the size above: the same template lays itself out for all 6 sizes — send size or sizes with the request.

For fitness, language, meditation and habit apps that let people share what they just did, so the render runs once per user action. The activity title shrinks to fit, metrics and names end with an ellipsis, the stamp keeps three lines, and without a picture the panel shows accent contour lines like a terrain map. Wide frames put the picture on the left with the metrics in two rows; square and vertical frames put it on top and the numbers in one row or a two-by-two grid.

Fields

Every field is optional. Long text shrinks to fit instead of overflowing; an image field takes a public URL that we fetch on our side.

Field Type Description Example
activity text What was done, e.g. Morning river run. default: Workout complete Morning river run
user_name text Name of the person; its first letter replaces a missing avatar. Maya Chen
avatar image URL Photo of the person. https://example.com/images/avatar-woman2.jpg
metrics text Up to four metrics as label|value pairs separated by semicolons, e.g. Distance|12.4 km; Time|1:02:18. Distance|12.4 km; Time|1:02:18; Pace|5:01 /km; Climb|86 m
streak text Streak as written, e.g. 23-day streak. Its first number fills a row of 14 dots. 23-day streak
date text Date and time as written, e.g. Sun, Oct 26 · 7:42. Sun, Oct 26 · 7:42
badge text Text of the stamp, e.g. Personal best 10K. Leave empty for no stamp. Personal best 10K
image image URL Route map, course cover or any picture of the activity. https://example.com/images/b04-route-map.png
app_name text App name next to the logo. Stride
logo image URL App logo. https://example.com/images/logo-p.png
accent colour Brand colour as hex, e.g. #6366f1. Drives buttons, highlights and the background glow. default: #f97316 #f97316
theme dark | light Colour scheme: dark or light. default: light —

Render it with one request

Use the slug as template. The response holds the URL of the finished PNG; ?wait=true keeps the connection open until it is ready.

curl -X POST "https://shareglint.com/v1/images?wait=true" \
  -H "Authorization: Bearer sk_live_YOUR_KEY" \
  -H "Content-Type: application/json" \
  -d '{
    "template": "app-share-achievement",
    "modifications": {
        "activity": "Morning river run",
        "user_name": "Maya Chen",
        "metrics": "Distance|12.4 km; Time|1:02:18; Pace|5:01 /km; Climb|86 m",
        "streak": "23-day streak",
        "date": "Sun, Oct 26 · 7:42",
        "badge": "Personal best 10K",
        "app_name": "Stride",
        "avatar": "https://example.com/images/avatar-woman2.jpg",
        "image": "https://example.com/images/b04-route-map.png",
        "logo": "https://example.com/images/logo-p.png"
    }
}'

Or paste a signed URL into og:image

For static sites, Webflow, Shopify and no-code tools: put the fields in the query string and sign it with your signing secret. The first request renders the image, every later one is a redirect to the cached file. How to compute the signature.

<meta property="og:image" content="https://shareglint.com/i/acc_YOUR_ACCOUNT_ID/app-share-achievement.png?activity=Morning%20river%20run&app_name=Stride&badge=Personal%20best%2010K&date=Sun%2C%20Oct%2026%20%C2%B7%207%3A42&metrics=Distance%7C12.4%20km%3B%20Time%7C1%3A02%3A18%3B%20Pace%7C5%3A01%20%2Fkm%3B%20Climb%7C86%20m&streak=23-day%20streak&user_name=Maya%20Chen&s=YOUR_SIGNATURE">

Make it yours

accent and theme change per request. For anything more, copy the template into your account: you get an ordinary HTML template with the same fields that you can edit in the dashboard or through the API. If the slug is free on your account, the copy takes it — your integrations switch to your version without changing a line.

curl -X POST "https://shareglint.com/v1/templates/library/app-share-achievement/copy" \
  -H "Authorization: Bearer sk_live_YOUR_KEY"
Use this template — start free

More Data, charts & milestones templates

Stat highlight Open Graph image template rendered by Shareglint Stat highlight Fundraising goal Open Graph image template rendered by Shareglint Fundraising goal Metrics grid Open Graph image template rendered by Shareglint Metrics grid Bar chart Open Graph image template rendered by Shareglint Bar chart Milestone celebration Open Graph image template rendered by Shareglint Milestone celebration Year in review Open Graph image template rendered by Shareglint Year in review Line chart Open Graph image template rendered by Shareglint Line chart Donut chart Open Graph image template rendered by Shareglint Donut chart Poll results Open Graph image template rendered by Shareglint Poll results

All 14 Data, charts & milestones templates →  ·  All templates →