skills.rest
akashagl92
akashagl92COMMUNITY
Explore all skills by this author →
𝕏@akash2692GitHub

Social Media Capture

Capture HTML animations as platform-optimized MP4 videos or GIFs using Puppeteer and ffmpeg.

Updated Dec 19, 2025
Search Tags:#html#video#animation#puppeteer#ffmpeg#social-media#capture
One-click install
npx skills add https://github.com/akashagl92/Portfolio --skill social-media-capture
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: Social Media Capture
Source: https://github.com/akashagl92/Portfolio/tree/main/.agent/skills/social-media-capture
Command: npx skills add https://github.com/akashagl92/Portfolio --skill social-media-capture

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires puppeteer, and includes scripts (resource) components.

What problem does it solve?

Capture HTML animations/visualizations as platform-optimized videos (MP4) or GIFs for social posts across LinkedIn, Instagram, X/Twitter, and Substack. It uses headless Chrome (Puppeteer) for real-time frame capture and ffmpeg for encoding.

Core Features & Use Cases

  • Headless capture of HTML animations using Puppeteer for accurate frame rendering.
  • Encoding to MP4 or GIF with platform-specific presets and sizes.
  • Quick-start workflows to generate ready-to-post visuals from local HTML files. Use cases include turning data visualizations or in-browser demos into shareable social content, tutorials, or marketing visuals.

Quick Start

Pass your HTML animation file and target platform to the script to generate a ready-to-post social video or GIF.

Frequently Asked Questions about Social Media Capture

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I convert HTML animations to MP4 videos for social media?▼

To convert HTML animations to MP4 videos for social media, this Skill uses Puppeteer for headless frame capture and ffmpeg for encoding, applying platform-specific presets to generate ready-to-post files.

Can I capture in-browser data visualizations as GIFs for Instagram or X?▼

Yes, you can capture in-browser data visualizations as GIFs for Instagram or X. The tool encodes headless Chrome frame captures into platform-optimized formats suitable for social media posts.

Do I need Puppeteer and ffmpeg installed to capture HTML animations?▼

Yes, you need Puppeteer and ffmpeg installed to capture HTML animations. Puppeteer handles the real-time headless Chrome frame rendering, while ffmpeg performs the video encoding with platform-specific presets.

What is the best way to record local HTML files for LinkedIn video posts?▼

The best way to record local HTML files for LinkedIn video posts is passing the file and target platform to the capture script, which renders frames with Puppeteer and encodes them with platform-specific ffmpeg presets.

Does this tool support platform-optimized video presets for Substack and Twitter?▼

Yes, this tool supports platform-optimized video presets for Substack and X/Twitter. It encodes captured headless Chrome frames into specific sizes and formats required for each social media platform.

Related Skills

Explore More Content & Communication Skills→
thisismynewfmail-uithisismynewfmail-ui

p5js

Generate self-contained p5.js HTML sketches from text prompts with deterministic output.

Community
Advanced
Nir-BhayNir-Bhay
19

social-media-marketing

Provides platform-specific marketing strategies and content planning for Instagram, TikTok, LinkedIn, Facebook, and Twitter/X.

Community
Advanced
vibe-motionvibe-motion
999

threejs-earth-render

Render 3D Earth route animations with Three.js and Puppeteer frame capture.

Official
Intermediate
adoptaiadoptai
25

noui-autopilot

Record browser workflows and compile them into MCP servers.

Official
Advanced