A powerful automation skill that transforms website URLs into 60-second animated promotional videos using Remotion, React, and TTS narration.
Install & Download
1. ClawHub CLI
The fastest way to install a skill directly from the registry.
npx clawhub@latest install url2video
2. Manual Installation
Copy the skill folder to one of these locations
~/.openclaw/skills/ <project>/skills/ Priority: Workspace > Local > Bundled
3. Prompt Installation
Copy this prompt to OpenClaw to install it automatically.
Help me install url2video using Clawhub. If Clawhub is not installed, install it first (npm i -g clawhub).
Prefer to download?
Get the raw skill files in a ZIP archive.
What is Website to Video Generator?
The Website to Video Generator is a sophisticated tool designed for the Openclaw Skills ecosystem that automates the entire video production pipeline. It begins by deep-scraping a target website to extract brand identity, core value propositions, and color palettes. Using this data, it dynamically generates a Remotion-based React project to create professional, tech-style animations.
This skill is specifically optimized for developers and marketers who need high-quality video content without manual editing. It integrates text-to-speech (TTS) for narration, sources royalty-free background music, and utilizes VPS-optimized rendering settings to ensure successful video generation even on resource-constrained environments.
Website to Video Generator Use Cases
- Automatically generating brand promotional videos directly from a company homepage.
- Creating social media video content for new product launches or feature updates.
- Scaling video marketing efforts by converting long-form web content into 60-second animated clips.
- Producing tech-style explainer videos with synchronized Chinese or English narration and subtitles.
How Website to Video Generator Works
- Scrape the target URL to extract brand names, taglines, core services, and key statistics using smart search tools.
- Analyze the website's CSS and assets to identify primary and secondary brand colors for visual consistency.
- Initialize a specialized Remotion project structure and install necessary React dependencies.
- Compose a 5-segment narration script and generate high-quality audio files using TTS tools.
- Download and mix tech-style background music at an optimized volume level.
- Build React animation components using SVG icons and a dedicated safe-area layout for subtitles.
- Execute a VPS-optimized render at 854x480 resolution to prevent memory issues while maintaining visual clarity.
Website to Video Generator Setup
To get started with this skill within the Openclaw Skills environment, ensure you have Node.js and Python installed, then initialize your project workspace:
# Install Remotion CLI and dependencies
npm install remotion @remotion/cli react react-dom
# Prepare the workspace directory
mkdir -p remotion-promo-project/{src,audio,out}
# Verify ffmpeg is installed for audio concatenation
ffmpeg -version
Website to Video Generator Data Schema & Taxonomy
The skill organizes data into a structured directory to manage assets and rendering outputs effectively:
| Directory/File | Description |
|---|---|
src/ |
Contains the React/Remotion animation source code and compositions. |
audio/ |
Stores the raw TTS segments, narration script, and background music. |
out/ |
The destination for the final rendered video.mp4. |
stills/ |
Keyframe screenshots (Scenes 1-5) used for user review before final rendering. |
remotion.config.ts |
Technical configuration for frame rate, resolution, and concurrency settings. |
Website to Video Generator Advanced Features
- Automatic extraction of CSS hex codes to match video themes to existing brand identity.
- Multi-segment TTS synchronization with dynamic subtitle components using React hooks.
- Low-memory rendering mode using concurrency limits to prevent SIGKILL errors on standard VPS instances.
- Lightning-fast number counters and geometric SVG decorations for a modern SaaS aesthetic.
- Pre-render screenshot generation for rapid feedback loops and quality assurance.
SKILL.md
Loading
Related Openclaw Skills
PPT to Video Generator
A specialized skill for transforming static PowerPoint presentations into fully narrated, subtitled, and professionally synchronized videos.
FMT Video Production Skill
An automated medical video synthesis tool that converts static images and raw clips into polished science communication videos with subtitles and narration.
FMT High-Definition Dynamic Generator
A specialized AIGC engine that creates consistent 4K medical illustrations and 1080P animated videos for fecal microbiota transplant (FMT) education.
Messy Idea to System Diagram
A specialized visual thinking tool that converts fragmented notes into structured, one-page system diagrams with labeled relationships and explicit uncertainty markers.
System Optimizer
A high-performance system maintenance tool designed to automate temporary file cleanup and memory optimization for peak efficiency.
Skill Design Patterns
A definitive framework for creating high-quality AI agent skills that prevent shortcuts and ensure technical accuracy.
Featured*
