What is the Social media carousel agent skill?

Install the belt CLI skill: npx skills add belt-sh/cli. Its edge is a particular angle on social content, giving the agent tighter constraints than a plain social media carousel request.

What inputs does Social media carousel need?

Context for social content: your goals, audience, constraints, and any source material the skill asks for.

What does Social media carousel output?

A ready-to-use result for social content: the analysis, copy, or recommendations the agent produces.

Social media carousel

Quick answer

01What is it?: Install the belt CLI skill: npx skills add belt-sh/cli. Its edge is a particular angle on social content, giving the agent tighter constraints than a plain social media carousel request.
02Inputs: Context for social content: your goals, audience, constraints, and any source material the skill asks for.
03Output: A ready-to-use result for social content: the analysis, copy, or recommendations the agent produces.

Add this skill

Install-only

Install as a package

Installs this one skill package for your coding agent, including any supporting files that skill ships with — not every skill in the repository. Read the tutorial.

Terminal

$ npx skills add inference-sh/skills --skill social-media-carousel

Skill instructions

The instruction file for this skill. The skill also includes other files you need to install to use it.

SKILL.md

Preview only — coding agent install

Install the belt CLI skill: npx skills add belt-sh/cli

Social Media Carousel

Design high-engagement carousel posts via inference.sh (https://inference.sh) CLI.

Quick Start

Requires inference.sh CLI (belt). Install instructions (https://raw.githubusercontent.com/inference-sh/skills/refs/heads/main/cli-install.md)

belt login

# Generate a carousel slide
belt app run infsh/html-to-image --input '{
  "html": "<div style=\"width:1080px;height:1080px;background:#0f172a;display:flex;align-items:center;justify-content:center;padding:80px;font-family:system-ui;color:white;text-align:center\"><div><p style=\"font-size:24px;color:#818cf8;text-transform:uppercase;letter-spacing:3px\">5 Rules for</p><h1 style=\"font-size:64px;margin:16px 0;font-weight:900;line-height:1.1\">Writing Headlines That Convert</h1><p style=\"font-size:22px;opacity:0.5;margin-top:24px\">Swipe →</p></div></div>"
}'

Platform Specs

Platform	Dimensions	Slides	Aspect Ratios
Instagram	1080 x 1080 px	Up to 20	1:1 (default), 4:5, 16:9
LinkedIn	1080 x 1080 px or 1080 x 1350	Up to 20	1:1, 4:5
Twitter/X	1080 x 1080 px	Up to 4	1:1, 16:9
Facebook	1080 x 1080 px	Up to 10	1:1, 4:5

Use 1080 x 1350 (4:5) on Instagram and LinkedIn — takes up more screen real estate in the feed than square.

Carousel Structure

The 7-Slide Framework

Slide	Purpose	Content
1	Hook	Bold claim, question, or promise — stops the scroll
2	Context	Why this matters, set up the problem
3-6	Value	One point per slide, numbered
7	CTA	Follow, save, share, comment, visit link

Slide 1: The Hook

The most important slide. If this fails, nobody swipes.

Hook Type	Example
Bold claim	"90% of landing pages make this mistake"
Question	"Why do your ads get clicks but no conversions?"
Number + promise	"7 Python tricks I wish I learned sooner"
Contrarian	"Stop writing blog posts (do this instead)"
Before/after	Show transformation

# Hook slide
belt app run infsh/html-to-image --input '{
  "html": "<div style=\"width:1080px;height:1350px;background:linear-gradient(180deg,#1e1b4b,#312e81);display:flex;align-items:center;justify-content:center;padding:80px;font-family:system-ui;color:white;text-align:center\"><div><h1 style=\"font-size:72px;font-weight:900;line-height:1.15;margin:0\">90% of Landing Pages Make This Mistake</h1><p style=\"font-size:28px;opacity:0.6;margin-top:32px\">Swipe to find out →</p></div></div>"
}'

Slides 2-6: Content Slides

One point per slide. Never cram multiple ideas.

# Content slide template
belt app run infsh/html-to-image --input '{
  "html": "<div style=\"width:1080px;height:1350px;background:#1e1b4b;padding:80px;font-family:system-ui;color:white;display:flex;flex-direction:column;justify-content:center\"><div><p style=\"font-size:120px;font-weight:900;color:#818cf8;margin:0;line-height:1\">01</p><h2 style=\"font-size:48px;margin:24px 0 16px;font-weight:800;line-height:1.2\">Your headline is too vague</h2><p style=\"font-size:26px;opacity:0.8;line-height:1.6\">\"Welcome to our platform\" tells the visitor nothing. Lead with the outcome: \"Ship docs in minutes, not days.\"</p></div></div>"
}'

Slide 7: CTA Slide

# CTA slide
belt app run infsh/html-to-image --input '{
  "html": "<div style=\"width:1080px;height:1350px;background:linear-gradient(180deg,#312e81,#1e1b4b);display:flex;align-items:center;justify-content:center;padding:80px;font-family:system-ui;color:white;text-align:center\"><div><h2 style=\"font-size:56px;font-weight:900;margin:0;line-height:1.2\">Found this useful?</h2><p style=\"font-size:32px;opacity:0.8;margin-top:24px;line-height:1.5\">Save this post for later 🔖<br>Follow for more tips</p><p style=\"font-size:24px;opacity:0.4;margin-top:40px\">@yourusername</p></div></div>"
}'

Design Rules

Text Hierarchy

Element	Size (at 1080px)	Weight
Slide number	96-120px	Black (900)
Heading	48-64px	Bold (700-800)
Body text	24-28px	Regular (400)
Caption/tag	18-22px	Medium (500)

Readability

Rule	Value
Max words per slide	30-40
Max lines of body text	4-5
Line height	1.5-1.6
Font	Sans-serif (Inter, Montserrat, Poppins)
Text contrast	4.5:1 minimum (WCAG AA)

Visual Consistency

Element	Keep Consistent Across All Slides
Background color/gradient	Same palette, slight variations OK
Font family	Same font throughout
Text alignment	Same position (left or center)
Margins/padding	Same spacing
Accent color	Same highlight color
Numbering style	Same format (01, 02 or 1., 2.)

Carousel Types

Educational / Tips

Slide 1: "5 CSS tricks you need to know"
Slide 2: Trick 1 with code example
Slide 3: Trick 2 with code example
...
Slide 6: Trick 5 with code example
Slide 7: "Follow for more dev tips"

Storytelling / Case Study

Slide 1: "How we grew from 0 to $1M ARR"
Slide 2: The beginning (context)
Slide 3: The challenge
Slide 4: What we tried (failed)
Slide 5: What worked
Slide 6: The result (numbers)
Slide 7: Key takeaway + CTA

Before / After

Slide 1: "I redesigned this landing page"
Slide 2: Before screenshot
Slide 3: Problem 1 annotated
Slide 4: After screenshot
Slide 5: Improvement 1 explained
Slide 6: Results (conversion lift)
Slide 7: "Want a review? DM me"

Listicle / Tools

Slide 1: "10 tools every designer needs in 2025"
Slides 2-6: 2 tools per slide with logo + one-liner
Slide 7: "Save this for later 🔖"

Swipe Psychology

Principle	Application
Curiosity gap	Hook promises value that requires swiping
Numbered progress	"3/7" creates completion drive
Visual continuity	Consistent design signals "there's more"
Increasing value	Best tip last — rewards completing
Swipe cue	Arrow or "Swipe →" on slide 1

Batch Generation

# Generate all slides for a carousel
for i in 1 2 3 4 5 6 7; do
  belt app run infsh/html-to-image --input "{
    \"html\": \"<div style='width:1080px;height:1350px;background:#1e1b4b;display:flex;align-items:center;justify-content:center;padding:80px;font-family:system-ui;color:white'><div style='text-align:center'><p style='font-size:28px;opacity:0.5'>Slide $i of 7</p></div></div>\"
  }" --no-wait
done

AI-Generated Carousel Visuals

# Generate illustrations for each slide
belt app run falai/flux-dev-lora --input '{
  "prompt": "minimal flat illustration, person at desk with laptop, clean modern style, simple shapes, limited color palette purple and blue tones, white background, icon style",
  "width": 1080,
  "height": 1080
}'

Common Mistakes

Mistake	Problem	Fix
Weak hook (slide 1)	Nobody swipes	Bold claim, question, or number + promise
Too much text per slide	Overwhelming, stops reading	Max 30-40 words per slide
No visual consistency	Looks like different posts	Same colors, fonts, margins throughout
No swipe indicator	People don't realize there's more	Add "Swipe →" or arrow on slide 1
No CTA on last slide	Missed engagement opportunity	Ask to save, follow, share, or comment
Inconsistent numbering	Feels disorganized	Same number format on every content slide
Cramming 2+ ideas per slide	Hard to digest	One point per slide, always
Square format on Instagram	Wastes feed real estate	Use 1080x1350 (4:5) for more visibility

Related Skills

npx skills add inference-sh/skills@ai-image-generation
npx skills add inference-sh/skills@content-repurposing
npx skills add inference-sh/skills@linkedin-content

Browse all apps: belt app store

Common questions

How do I install Social media carousel in Cursor, Claude Code, or Codex?

Run npx skills add inference-sh/skills --skill social-media-carousel in the project where you want it, then ask your agent for the skill by name. The --skill flag installs only Social media carousel, not every skill in the repository.

Where does Social media carousel come from and what license is it under?

Social media carousel comes from the inference-sh/skills repository on GitHub. That repository has 579 GitHub stars. No license was detected on the source repository, so check with the author before redistributing it.

Prefer plain text? Read the Social media carousel guide as markdown.