Menu
Automated video production using Remotion, combining Antigravity aesthetics with official Remotion best practices.
Install with Codex or Claude Copy this prompt, paste it into Codex, Claude, or another assistant, and let it review the skill page and install it for you.
Based on SOC occupation classification
Orchestrates a professional reporting workflow by combining design system intelligence with high-fidelity PDF generation.
Use this skill when visual quality and design identity matter for a PDF. CREATE (generate from scratch): "make a PDF", "generate a report", "write a proposal", "create a resume", "beautiful PDF", "professional document", "cover page", "polished PDF", "client-ready document". FILL (complete form fields): "fill in the form", "fill out this PDF", "complete the form fields", "write values into PDF", "what fields does this PDF have". REFORMAT (apply design to an existing doc): "reformat this document", "apply our style", "convert this Markdown/text to PDF", "make this doc look good", "re-style this PDF". This skill uses a token-based design system: color, typography, and spacing are derived from the document type and flow through every page. The output is print-ready. Prefer this skill when appearance matters, not just when any PDF output is needed.
Specialized in creating high-converting instructional videos and software tutorials using structured scripts and automated production.
Design intelligence for marketing UI/UX with custom design system generation.
Create stunning, animation-rich HTML presentations from scratch or by converting PowerPoint files. Use when the user wants to build a presentation, convert a PPT/PPTX to web, or create slides for a talk/pitch. Helps non-designers discover their aesthetic through visual exploration rather than abstract choices.
Marketing analytics, attribution models, KPI tracking, dashboards, and data-driven decision making.
| name | video-automation |
| description | Automated video production using Remotion, combining Antigravity aesthetics with official Remotion best practices. |
| allowed-tools | Read, RunCommand, Write |
This skill combines the remotion-best-practices skill with the Antigravity design system, enabling production-grade video ads.
For detailed technical implementation, refer to the remotion-best-practices skill which contains 16 comprehensive rule files:
| Core Rules | Description |
|---|---|
animations.md | Frame-based animations with useCurrentFrame() |
timing.md | Springs, easing, interpolation curves |
sequencing.md | <Sequence> and <Series> patterns |
transitions.md | Scene transitions with @remotion/transitions |
audio.md | Audio import, trimming, volume control |
videos.md | Video embedding, looping, speed control |
display-captions.md | TikTok-style captions with word highlighting |
charts.md | Animated bar/pie charts |
3d.md | Three.js integration with @remotion/three |
fonts.md | Google Fonts & Vietnamese font support |
Apply these design tokens to all Remotion components:
const ANTIGRAVITY_TOKENS = {
background: '#0a0a0c',
primary: '#00f2ff', // Neon Cyan
secondary: '#ff00e5', // Neon Pink
glass: 'rgba(255, 255, 255, 0.05)',
fonts: ['Inter', 'Be Vietnam Pro'],
};
Key styling patterns:
backdropFilter: 'blur(20px)' with neon bordersi * 10)Math.sin(frame/10) for pulsing effectsbrowser_subagent to extract brand colors, images, headlinesinterpolate, spring, Sequence to animate sections// Refer to display-captions.md in remotion-best-practices
import { createTikTokStyleCaptions } from '@remotion/captions';
For non-tech users, just 3 commands:
| Command | Purpose |
|---|---|
npx remotion preview | Preview in browser |
npx remotion render <id> out.mp4 | Export final video |
--port=300x | Run multiple previews |
brew install ffmpeg
npx remotion render <id> --browser-executable="/Applications/Google Chrome.app/Contents/MacOS/Google Chrome"