Agent skill

Create HTML Carousel

by gooseworks-ai in gooseworks-ai/goose-skills

Create LinkedIn carousel posts as high-quality PNG images. An agent skill from gooseworks-ai/goose-skills.

MITAuto-check passedMedia & Creative

Install Create HTML Carousel

skills CLI
$ npx skills add gooseworks-ai/goose-skills --skill create-html-carousel -a claude-code

Project install by default; add -g for ~/.claude/skills/.

GitHub CLI
$ gh skill install gooseworks-ai/goose-skills create-html-carousel --agent claude-code

Project scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).

Manual copy
$ git clone --depth 1 https://github.com/gooseworks-ai/goose-skills.git skills-src && mkdir -p .claude/skills && cp -r skills-src/skills/design/capabilities/create-html-carousel .claude/skills/create-html-carousel && rm -rf skills-src

Use ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.

Claude Code skills documentation · loads skills from .claude/skills/

Facts

Skill name
create-html-carousel
GitHub stars
1.2k
Used in
1 other repo
Token cost
~4.6k tokens
SKILL.md length
1,291 words
Files
6
Skills in repo
193
Repo updated
First seen
Licence
MIT

At a glance

Create LinkedIn carousel posts as high-quality PNG images. An agent skill from gooseworks-ai/goose-skills.

  • Works in 5 steps: Content Discovery → Style Selection → Generate HTML Carousel → …
  • Tasks that involve Infographics
  • SKILL.md covers Core Philosophy, LinkedIn Carousel Specs, When to Use This Skill and Workflow Overview, plus 8 more sections
  • Runs JavaScript scripts from its folder; calls npm, node and npx; reaches api.fontshare.com

What it does

Create HTML Carousel is an agent skill from gooseworks-ai/goose-skills. Create LinkedIn carousel posts as high-quality PNG images. Design informational multi-slide posts like "5 AI GTM workflows" with consistent styling, then automatically screenshot each slide at LinkedIn's optimal 1080x1080px format.

Its SKILL.md is about 4.6k tokens, which your agent loads only when the skill is triggered. The skill folder holds 5 other files (for example `README.md`, `STYLE_PRESETS.md` and `package.json`).

It sits in Media & Creative, covering Infographics, Slides and decks and Go-to-market strategy. It works with LinkedIn. The repository describes itself as: Library of Growth & GTM skills + data APIs for Claude Code, Codex, Cursor to run ads, social, content, lead gen, seo and data scraping. The licence is MIT.

When your agent uses it

  • Tasks that involve Infographics
  • Tasks that involve Slides and decks
  • Tasks that involve Go-to-market strategy

Example prompts

  • “5 AI GTM workflows”
  • “/create-html-carousel”

Requirements

  • Node.js

Workflow steps

5 steps, taken from the step headings in SKILL.md.

  1. Content Discovery
  2. Style Selection
  3. Generate HTML Carousel
  4. Screenshot Generation
  5. Delivery

What it can do on your machine

Read from SKILL.md and the folder at commit 4b07e0b. It shows what the files ask for, not the result of running them.

  • Tool permissions

    Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.

    From allowed-tools in the SKILL.md frontmatter.

  • Runs code

    Ships script files (JavaScript), which the agent can run.

    Shell commands in SKILL.md call:

    • npm
    • node
    • npx

    From the folder's file list and the shell code blocks in SKILL.md.

  • Network

    Hosts in commands or code, which the agent is likely to contact:

    • api.fontshare.com

    From URLs in SKILL.md, links to its own repository left out.

  • Credentials

    Names no API keys, tokens, secrets or passwords.

    From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.

Context cost

Create HTML Carousel loads about 4.6k tokens when it runs. Until then it costs about 63 tokens; SKILL.md has 1,291 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it
~63
When it runs · the whole SKILL.md, loaded when a task matches
~4.6k

Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.

Safety

Auto-check passed

The automated check found no risky patterns in SKILL.md.

Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.

SKILL.md

The full file from gooseworks-ai/goose-skills at commit 4b07e0b, republished under its MIT licence (© gooseworks-ai). 1,291 words, ~4,611 tokens.

Download SKILL.mdSave it as .claude/skills/create-html-carousel/SKILL.md (or your agent's skills folder). This skill also uses 5 other files; get the full folder from GitHub.
name
create-html-carousel
description
Create LinkedIn carousel posts as high-quality PNG images. Design informational multi-slide posts like "5 AI GTM workflows" with consistent styling, then automatically screenshot each slide at LinkedIn's optimal 1080x1080px format.

Deprecated: This skill is superseded by goose-graphics. See skills/composites/goose-graphics/ (install with npx goose-skills install goose-graphics). The carousel format is one of seven formats in the newer skill and supports 36 style presets plus image sourcing and PNG export. This skill is retained for one release cycle before removal.

Create stunning LinkedIn carousel posts as PNG images. This skill generates styled HTML slides optimized for square format (1080×1080px), then automatically screenshots each slide for direct upload to LinkedIn.

Core Philosophy

  1. LinkedIn-First Design — Square format (1080×1080px), optimized for mobile feed viewing
  2. Informational Content — Tips, workflows, lists, frameworks (not presentations)
  3. Consistent Styling — Reuse proven design systems from frontend-slides
  4. Automated Export — Generate HTML → Screenshot → PNG files ready for LinkedIn
  5. Viewport Perfect — Every slide must fit exactly in 1080×1080px without scrolling

Format: Square (1080×1080px)

  • Aspect ratio: 1:1
  • File format: PNG (recommended) or JPG
  • File size: Under 10MB per image
  • Max slides: 10 images per carousel
  • Ideal slide count: 5-8 slides (best engagement)

Content Structure:

  1. Cover slide — Hook + title + your brand
  2. Content slides — One key point per slide (3-6 slides)
  3. Closing slide — CTA / summary / follow prompt

When to Use This Skill

Use for LinkedIn carousel posts like:

  • "5 AI GTM workflows you should be using"
  • "How to build X: A step-by-step guide"
  • "7 mistakes founders make with Y"
  • "The complete framework for Z"
  • "Before & After: How we 10x'd our metrics"

NOT for:

  • Long-form presentations (use frontend-slides)
  • Video content
  • Single-image posts

Workflow Overview

1. Content Input → User provides topic/outline
2. Style Selection → Choose visual style (or preview options)
3. HTML Generation → Create 1080×1080px HTML slides
4. Screenshot → Auto-capture each slide as PNG
5. Delivery → Folder of PNG files ready for LinkedIn upload

Phase 1: Content Discovery

Step 1.1: Get Topic & Structure

Ask the user:

Question 1: What's the topic?

  • Header: "Topic"
  • Question: "What's the main topic of this carousel?"
  • (Free text input)

Question 2: Content Type

  • Header: "Format"
  • Question: "What type of post is this?"
  • Options:
    • "Numbered list" — "5 ways to...", "7 mistakes...", "3 steps to..."
    • "How-to guide" — Step-by-step tutorial or process
    • "Framework" — Concept explanation with structure
    • "Before/After" — Transformation or case study
    • "Insights/Tips" — Collection of advice or learnings

Question 3: Slide Count

  • Header: "Length"
  • Question: "How many slides?"
  • Options:
    • "Short (5-6)" — Quick, punchy (best for mobile scrolling)
    • "Medium (7-8)" — Standard carousel length
    • "Long (9-10)" — Maximum LinkedIn allows

Question 4: Branding Handle

  • Header: "Brand"
  • Question: "What handle or name should appear on each slide?"
  • (Free text input — e.g., "@yourhandle", "Acme Inc", or leave blank for none)

Question 5: Content Ready?

  • Header: "Content"
  • Question: "Do you have the content written?"
  • Options:
    • "Yes, I have all content" — Paste it in
    • "I have bullet points" — Need light formatting
    • "Just the topic" — Need help outlining

If user has content, ask them to share it.

Content Density Rules for LinkedIn

Each slide should be scannable in 2-3 seconds on mobile:

Slide TypeMax Content
CoverTitle (1 line) + subtitle (1 line) + branding
List itemNumber/icon + heading (2 lines max) + body (3 lines max)
FrameworkDiagram/visual + 2-4 labels
Quote/Stat1 large stat or quote + context
CTA1 action + visual element

If content exceeds limits: Break into multiple slides or simplify.


Phase 2: Style Selection

Users can choose styles two ways:

Option A: Direct Selection (Faster)

Show preset picker:

Question: Pick a Style

  • Header: "Style"
  • Question: "Which visual style works best for your content?"
  • Options:
    • "Bold Signal" — High-contrast card on dark, confident
    • "Dark Botanical" — Elegant dark with soft abstract shapes
    • "Notebook Tabs" — Editorial cream paper with colorful tabs
    • "Pastel Geometry" — Friendly pastels with decorative pills
    • "Neon Cyber" — Futuristic tech aesthetic
    • "Split Pastel" — Playful two-tone split design

(See STYLE_PRESETS.md for full details on each style)

Option B: Guided Discovery

If user isn't sure, ask:

Question: Audience & Tone

  • Header: "Vibe"
  • Question: "Who's your audience and what tone?"
  • Options:
    • "Professional/Corporate" → Recommend: Bold Signal, Dark Botanical
    • "Creative/Playful" → Recommend: Split Pastel, Pastel Geometry
    • "Technical/Dev-focused" → Recommend: Neon Cyber, Terminal Green
    • "Elegant/Premium" → Recommend: Dark Botanical, Paper & Ink

Then generate 2-3 preview slides and let user pick.


File Structure

All carousel files (HTML source and PNG exports) are saved to the shared assets directory.

[carousel-name]/
├── index.html              # Full carousel (all slides)
├── slides/
│   ├── slide-01.html       # Individual slide pages
│   ├── slide-02.html
│   └── ...
└── exports/
    ├── slide-01.png        # Screenshots (generated in Phase 4)
    ├── slide-02.png
    └── ...
HTML Architecture for 1080×1080px

CRITICAL: LinkedIn carousel slides are SQUARE (1:1 ratio), not widescreen.

html
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Slide 01</title>

    <!-- Fonts -->
    <link rel="stylesheet" href="https://api.fontshare.com/v2/css?f[]=..." />

    <style>
      /* ===========================================
           LINKEDIN CAROUSEL: SQUARE FORMAT
           Fixed 1080×1080px for screenshot
           =========================================== */
      :root {
        /* Fixed size for LinkedIn */
        --slide-width: 1080px;
        --slide-height: 1080px;

        /* Colors (from chosen preset) */
        --bg-primary: #0a0f1c;
        --text-primary: #ffffff;
        --accent: #00ffcc;

        /* Typography - scaled for square format */
        --title-size: 72px;
        --subtitle-size: 36px;
        --body-size: 28px;
        --small-size: 20px;

        /* Spacing */
        --slide-padding: 80px;
        --content-gap: 40px;

        /* Animation */
        --ease-out-expo: cubic-bezier(0.16, 1, 0.3, 1);
      }

      * {
        margin: 0;
        padding: 0;
        box-sizing: border-box;
      }

      html,
      body {
        width: var(--slide-width);
        height: var(--slide-height);
        overflow: hidden;
      }

      body {
        font-family: var(--font-body);
        background: var(--bg-primary);
        color: var(--text-primary);
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        padding: var(--slide-padding);
      }

      /* Content container */
      .slide-content {
        width: 100%;
        max-width: 100%;
        display: flex;
        flex-direction: column;
        gap: var(--content-gap);
      }

      /* Typography hierarchy */
      h1 {
        font-size: var(--title-size);
        font-weight: 800;
        line-height: 1.1;
        margin-bottom: 20px;
      }

      h2 {
        font-size: var(--subtitle-size);
        font-weight: 700;
        line-height: 1.2;
      }

      p,
      li {
        font-size: var(--body-size);
        line-height: 1.4;
      }

      /* List styling */
      ul {
        list-style: none;
      }

      li {
        padding-left: 40px;
        position: relative;
        margin-bottom: 20px;
      }

      li::before {
        content: "→";
        position: absolute;
        left: 0;
        color: var(--accent);
        font-weight: bold;
      }

      /* Number badge (for list items) */
      .number {
        font-size: 120px;
        font-weight: 900;
        color: var(--accent);
        opacity: 0.15;
        position: absolute;
        top: -40px;
        left: -20px;
        z-index: 0;
      }

      /* Branding footer */
      .brand {
        position: absolute;
        bottom: var(--slide-padding);
        right: var(--slide-padding);
        font-size: var(--small-size);
        opacity: 0.7;
      }

      /* ===========================================
           STYLE-SPECIFIC OVERRIDES
           Inject preset styles here
           =========================================== */
      /* ... preset-specific CSS ... */
    </style>
  </head>
  <body>
    <div class="slide-content">
      <!-- Slide content goes here -->
      <h1>Your Title Here</h1>
      <p>Your content here</p>
    </div>

    <div class="brand">@yourbrand</div>
  </body>
</html>
Content Slide Templates

Cover Slide:

html
<div class="slide-content">
  <h1>5 AI GTM Workflows<br />You Should Be Using</h1>
  <p>Scale your outbound without scaling your team</p>
</div>
<div class="brand">@yourhandle</div>

Numbered Item (e.g., Slide 2/6):

html
<div class="slide-content">
  <div class="number">01</div>
  <h2>Signal-Based Outbound</h2>
  <p>
    Monitor job postings, funding announcements, and tech stack changes to find
    companies actively solving your problem.
  </p>
</div>
<div class="brand">@yourhandle • 1/5</div>

Framework Slide:

html
<div class="slide-content">
  <h2>The GTM Engineering Stack</h2>
  <div class="framework-grid">
    <div class="box">Research</div>
    <div class="box">Personalization</div>
    <div class="box">Outreach</div>
    <div class="box">Tracking</div>
  </div>
</div>
<div class="brand">@yourhandle • 3/5</div>

CTA Slide:

html
<div class="slide-content">
  <h2>Want more like this?</h2>
  <p>Follow me for more tips and workflows.</p>
  <div class="cta">Hit that follow button →</div>
</div>
<div class="brand">@yourhandle</div>

Phase 4: Screenshot Generation

After generating HTML, automatically capture screenshots.

Create a Node.js script to screenshot each slide:

javascript
// screenshot-slides.js
const { chromium } = require("playwright");
const path = require("path");
const fs = require("fs");

async function screenshotSlides(slidesDir, outputDir) {
  const browser = await chromium.launch();
  const page = await browser.newPage();

  // Set viewport to LinkedIn carousel size
  await page.setViewportSize({ width: 1080, height: 1080 });

  // Ensure output directory exists
  if (!fs.existsSync(outputDir)) {
    fs.mkdirSync(outputDir, { recursive: true });
  }

  // Find all HTML files in slides directory
  const slideFiles = fs
    .readdirSync(slidesDir)
    .filter((f) => f.endsWith(".html"))
    .sort();

  console.log(`Found ${slideFiles.length} slides to screenshot`);

  for (const slideFile of slideFiles) {
    const slidePath = path.join(slidesDir, slideFile);
    const outputName = slideFile.replace(".html", ".png");
    const outputPath = path.join(outputDir, outputName);

    console.log(`Capturing ${slideFile}...`);

    await page.goto(`file://${path.resolve(slidePath)}`);

    // Wait for fonts and animations
    await page.waitForTimeout(500);

    // Take screenshot
    await page.screenshot({
      path: outputPath,
      type: "png",
      fullPage: false,
    });

    console.log(`✓ Saved ${outputName}`);
  }

  await browser.close();
  console.log("\n✨ All slides captured!");
}

// Usage
const carouselName = process.argv[2];
if (!carouselName) {
  console.error("Usage: node screenshot-slides.js <carousel-name>");
  process.exit(1);
}

const slidesDir = path.join(__dirname, carouselName, "slides");
const outputDir = path.join(__dirname, carouselName, "exports");

screenshotSlides(slidesDir, outputDir);
Installation

The skill directory needs these dependencies:

json
{
  "name": "linkedin-carousel-screenshots",
  "version": "1.0.0",
  "private": true,
  "dependencies": {
    "playwright": "^1.40.0"
  }
}

First time setup:

bash
cd /path/to/skills/create-html-carousel
npm install
Running Screenshot Script

After generating HTML slides:

bash
node screenshot-slides.js carousel-name

This will:

  1. Open each slide HTML in a headless browser
  2. Set viewport to 1080×1080px
  3. Wait for fonts/animations to load
  4. Capture PNG screenshot
  5. Save to [carousel-name]/exports/

Phase 5: Delivery

After screenshots are generated, present to user:

✨ Your LinkedIn carousel is ready!

📁 Location: /assets/carousel-name/

**Slides:**
- 6 HTML slides in slides/ folder
- 6 PNG images in exports/ folder (1080×1080px)

**Preview:**
Open index.html to see all slides with navigation.

**Upload to LinkedIn:**
1. Create new post on LinkedIn
2. Click "Add media"
3. Upload all PNGs from exports/ folder in order
4. Add your post copy
5. Publish!

**File sizes:**
- slide-01.png: 234 KB ✓
- slide-02.png: 198 KB ✓
- slide-03.png: 256 KB ✓
(All under 10MB limit)

Want to make any changes to the slides?

Style Adaptation for Square Format

All styles from frontend-slides work for carousels, but require these adjustments:

Show full SKILL.md (528 more words)Show less
Typography Scaling

Square format has less horizontal space, so scale fonts:

ElementPresentation (16:9)Carousel (1:1)
Titleclamp(2rem, 6vw, 5rem)72px (fixed)
Subtitleclamp(1.25rem, 3vw, 2.5rem)36px (fixed)
Bodyclamp(0.875rem, 1.5vw, 1.125rem)28px (fixed)
Smallclamp(0.75rem, 1vw, 0.875rem)20px (fixed)

Why fixed sizes? We're targeting a single export size (1080×1080px), not responsive web viewing.

Layout Adjustments

Vertical space is precious:

  • Reduce top/bottom padding (80px instead of 4rem)
  • Tighter line-height (1.2-1.4 instead of 1.5-1.6)
  • Fewer list items per slide (max 3-4)
  • Smaller decorative elements

Mobile-first mindset:

  • Most LinkedIn users view on phones
  • Text must be readable at thumbnail size
  • High contrast is critical
  • Bold, simple layouts beat intricate designs

Content Best Practices

Hook Formula (Cover Slide)

Strong hooks for LinkedIn carousels:

  • Number + Promise: "5 workflows that 10x'd our outbound"
  • Contrarian: "Stop doing X. Do this instead."
  • Before/After: "How we went from X to Y in 30 days"
  • Question: "Why are only 3% of founders doing this?"
  • Curiosity gap: "The GTM strategy nobody talks about"
Body Slides (Items 2-9)

Each slide should:

  1. One clear point — Don't cram multiple concepts
  2. Visual hierarchy — Large number/icon + heading + body
  3. Concrete, not abstract — "Use job postings to find intent" not "Leverage signals"
  4. Scannable — 2-3 second read time max
Closing Slide

Always include a CTA:

  • "Follow for more [topic]"
  • "Repost if this helped"
  • "Comment your biggest takeaway"
  • "DM me if you want the full playbook"

Avoid:

  • "Link in comments" (often gets buried)
  • "Check out my website" (feels salesy)
  • No CTA at all (wasted opportunity)

Troubleshooting

Fonts Not Loading in Screenshots

Symptom: Screenshots show default system fonts

Solution:

  1. Use web-safe fonts (Arial, Georgia) OR
  2. Add await page.waitForLoadState('networkidle') before screenshot
  3. Increase wait timeout: await page.waitForTimeout(1000)
Screenshots Are Blurry

Symptom: Text looks fuzzy or low-res

Solution:

  1. Set device scale factor in Playwright:
    javascript
    await page.setViewportSize({
      width: 1080,
      height: 1080,
      deviceScaleFactor: 2, // Retina-quality
    });
Content Overflows the Slide

Symptom: Text or elements cut off in screenshot

Solution:

  1. Reduce font sizes
  2. Decrease padding
  3. Split into multiple slides
  4. Simplify content (fewer bullets, shorter text)
Colors Look Different in Export

Symptom: PNG colors don't match HTML preview

Solution:

  • Ensure browser color profile matches sRGB
  • Use hex colors, avoid CSS filters that may render differently
  • Test screenshot script before generating all slides

Preset Quick Reference

PresetBest ForVibe
Bold SignalConfident, high-impactProfessional
Dark BotanicalElegant, premiumSophisticated
Notebook TabsEditorial, organizedFriendly-professional
Pastel GeometryFriendly, approachablePlayful
Neon CyberTech, innovationFuturistic
Split PastelCreative, funEnergetic

See STYLE_PRESETS.md for complete styling details.


  • frontend-slides — For full presentations (not carousels)
  • personalized-email — For outreach content to pair with LinkedIn posts
  • deep-web-research — For researching topics/stats for carousel content

Example Session Flow

  1. User: "Create a LinkedIn carousel about 5 AI GTM workflows"
  2. Skill asks: content type, slide count, have content ready?
  3. User provides bullet points of the 5 workflows
  4. Skill asks: style preference
  5. User picks "Bold Signal"
  6. Skill generates 7 HTML slides (cover + 5 workflows + CTA)
  7. Skill runs screenshot script automatically
  8. Skill delivers folder with HTML + PNG exports
  9. User uploads PNGs to LinkedIn and publishes

Total time: 5-10 minutes from idea to ready-to-publish carousel.

© gooseworks-ai, MIT. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file

Files

SKILL.md and 5 other files in skills/design/capabilities/create-html-carousel of gooseworks-ai/goose-skills.

  • SKILL.md
  • README.md
  • STYLE_PRESETS.md
  • package.json
  • screenshot-slides.js
  • skill.meta.json

Open the folder on GitHubat commit 4b07e0b

Used in 1 other repository

We found 1 copy of this SKILL.md (exact, near-identical or edited) in other folders, from 1 other GitHub owner. This page covers the copy in gooseworks-ai/goose-skills, which our catalogue first saw on October 7, 2026.

Compare with similar skills

Create HTML Carousel next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.

Create HTML Carousel compared with similar skills
SkillStarsUsed inTokensAuto-checkLicenceRepo updated
Create HTML Carousel this skillgooseworks-ai/goose-skills1.2k1 repos~4.6kAutomated safety check: PassMIT
CarouselsTheCraigHewitt/skills157—~2.3kAutomated safety check: PassMIT
43 Carousel Brief Globalminhnv0807/ai-business-skills608—~2.4kAutomated safety check: PassMIT
Gemini Carouselcharlie947/social-media-skills3.8k—~1.7kAutomated safety check: PassMIT
Threads Carouselitchernetski/threads-carousel-claude-skill107—~3.5kAutomated safety check: PassMIT
Social Media Carouseldanielmeppiel/agentic-sdlc-handbook1571 repos~2.2kAutomated safety check: PassCustom licence

Similar skills

  • Carousels

    TheCraigHewitt/skills

    Turns a piece of Craig's content (an email, a YouTube script, an essay, or pasted text) into a polished image carousel publishable to both LinkedIn and Instagram from one set of 1080x1350 slides.

    157 GitHub stars~2.3k tokensUpdated 4 mo ago
    Media & CreativeAuto-check passed
  • 43 Carousel Brief Global

    minhnv0807/ai-business-skills

    A skill your agent uses when a multi-slide carousel is needed for Instagram, Facebook, or LinkedIn — a narrative arc with the hook on slide one, value through the middle, CTA on the last, headline…

    608 GitHub stars~2.4k tokensUpdated 26 days ago
    Media & CreativeAuto-check passed
  • Gemini Carousel

    charlie947/social-media-skills

    Generate a branded slide-by-slide LinkedIn carousel using Gemini.

    3.8k GitHub stars~1.7k tokensUpdated 24 days ago
    Media & CreativeAuto-check passed
  • Threads Carousel

    itchernetski/threads-carousel-claude-skill

    Convert text posts into visual carousel images or presentations for Threads, Instagram, LinkedIn, TikTok, YouTube.

    107 GitHub stars~3.5k tokensUpdated 5 mo ago
    Documents & OfficeAuto-check passed
  • Social Media Carousel

    danielmeppiel/agentic-sdlc-handbook

    Multi-slide carousel design for Instagram, LinkedIn, and Twitter/X with layout rules and hooks.

    157 GitHub starsUsed in 1 repo~2.2k tokens
    Documents & OfficeAuto-check passed
  • Linkedin Carousel Generator

    dmccreary/ibook-skills

    Generates a 13-slide LinkedIn carousel (a "document post" — PPTX/PDF) that showcases an intelligent textbook's key features, with real screenshots, mascot art, and metrics pulled from the project.

    105 GitHub stars~3.7k tokensUpdated yesterday
    Documents & OfficeAuto-check passed

More from gooseworks-ai/goose-skills

All 193 skills in this repo
  • Render Hook Replacement

    gooseworks-ai/goose-skills

    Replace an existing video's opening with a supplied clip or free kinetic text hook while retaining and verifying every original body frame, audio, captions and ending.

    1.2k GitHub stars~2.3k tokensUpdated yesterday
    Auto-check passed
  • Competitor Post Engagers

    gooseworks-ai/goose-skills

    Find leads by scraping engagers from a competitor's top LinkedIn posts.

    1.2k GitHub starsUsed in 1 repo~1.8k tokens
    Auto-check: notes
  • Render Chatgpt Chat

    gooseworks-ai/goose-skills

    Assemble a ChatGPT chat-reveal video ad from a thread + timeline JSON — one continuous Playwright recording of a ChatGPT mobile chat (user types with the iOS keyboard up → taps send → keyboard…

    1.2k GitHub stars~2.2k tokensUpdated yesterday
    Auto-check passed
  • Create Image Gpt Image Fal

    gooseworks-ai/goose-skills

    Generate a single photoreal or designed image with OpenAI gpt-image via fal.ai.

    1.2k GitHub starsUsed in 1 repo~2.3k tokens
    Auto-check passed
  • Kol Discovery

    gooseworks-ai/goose-skills

    Find Key Opinion Leaders (KOLs) in a given domain by combining web research with LinkedIn post search.

    1.2k GitHub starsUsed in 1 repo~1.5k tokens
    Auto-check: notes
  • Kol Engager Icp

    gooseworks-ai/goose-skills

    Find ICP-fit leads from KOL audiences on LinkedIn. An agent skill from gooseworks-ai/goose-skills.

    1.2k GitHub starsUsed in 1 repo~1.7k tokens
    Auto-check: notes

Works with

Questions about Create HTML Carousel

What does Create HTML Carousel do?

Create LinkedIn carousel posts as high-quality PNG images. An agent skill from gooseworks-ai/goose-skills. Create HTML Carousel is an agent skill from gooseworks-ai/goose-skills. Create LinkedIn carousel posts as high-quality PNG images.

When should I use Create HTML Carousel?

Create HTML Carousel fits situations like: tasks that involve Infographics; tasks that involve Slides and decks; tasks that involve Go-to-market strategy.

How do I install Create HTML Carousel in Claude Code?

Run `npx skills add gooseworks-ai/goose-skills --skill create-html-carousel -a claude-code`. Or copy the skill folder (skills/design/capabilities/create-html-carousel in gooseworks-ai/goose-skills) into .claude/skills/create-html-carousel in your project. Claude Code loads it when a task matches its description.

How do I install Create HTML Carousel in Codex?

Run `npx skills add gooseworks-ai/goose-skills --skill create-html-carousel -a codex`. Or copy the skill folder (skills/design/capabilities/create-html-carousel in gooseworks-ai/goose-skills) into .agents/skills/create-html-carousel in your project. Codex loads it when a task matches its description.

Can I use Create HTML Carousel in Cursor, Gemini CLI or GitHub Copilot?

Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add gooseworks-ai/goose-skills --skill create-html-carousel -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/create-html-carousel, .gemini/skills/create-html-carousel, .github/skills/create-html-carousel and .opencode/skills/create-html-carousel in your project.

What does Create HTML Carousel need to run?

Going by SKILL.md and its folder, Create HTML Carousel needs JavaScript for the scripts in its folder and the command-line tools its instructions call (npm, node and npx). Our summary lists: Node.js.

Does Create HTML Carousel access the network?

SKILL.md names 1 domain. In commands or code: api.fontshare.com; the agent is likely to contact it when it follows the instructions. This is read from the text; nothing was executed.

Is Create HTML Carousel safe to install?

Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. Review the folder before installing.

What licence does Create HTML Carousel use?

Create HTML Carousel is published under the MIT licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.

How many tokens does Create HTML Carousel use?

About 4.6k tokens (SKILL.md is roughly 18k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full.

What are the alternatives to Create HTML Carousel?

Skills that share tags, products or a category with Create HTML Carousel: Carousels (TheCraigHewitt/skills, 157 stars), 43 Carousel Brief Global (minhnv0807/ai-business-skills, 608 stars), Gemini Carousel (charlie947/social-media-skills, 3.8k stars) and Threads Carousel (itchernetski/threads-carousel-claude-skill, 107 stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains Create HTML Carousel?

gooseworks-ai (a GitHub organization) maintains it in gooseworks-ai/goose-skills, which has 1,238 GitHub stars. The repository holds 193 skills in this directory. The repository was last updated on October 8, 2026.

Source: gooseworks-ai/goose-skills on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.