video-template-frame-creative-voltage

Generate energetic split-panel motion video compositions using HTML, CSS, and GSAP animation timelines.

93.2k|10.8k|Updated Apr 28, 2026

Search Tags:#template #video #Animation #Motion #html-video #Hyperframes

One-click install

npx skills add https://github.com/nexu-io/open-design --skill video-template-frame-creative-voltage

Or copy as Structured Prompt for Agent▼

Please help me install this Agent Skill.
Skill: video-template-frame-creative-voltage
Source: https://github.com/nexu-io/open-design/tree/main/plugins/_official/video-templates/frame-creative-voltage
Command: npx skills add https://github.com/nexu-io/open-design --skill video-template-frame-creative-voltage

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes assets (resource) components.

What problem does it solve?

This Skill automates the creation of high-quality, motion-graphic video templates, eliminating the need for manual video editing for repetitive brand or campaign title sequences.

Core Features & Use Cases

Deterministic Rendering: Produces consistent MP4 or WEBM video files from HTML/CSS/GSAP source code.
Dynamic Composition: Supports custom headlines, figures, and labels while maintaining complex motion signatures like offset panel slides and handwritten script strokes.
Use Case: Use this template to generate a series of energetic, retro-modern brand reveal videos for a social media campaign, ensuring visual consistency across all assets.

Quick Start

Use the video-template-frame-creative-voltage skill to render a 15-second 16:9 video with my custom title and script content.

Frequently Asked Questions about video-template-frame-creative-voltage

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

FAQPage Schema

How do I customize the text in the Creative Voltage template?▼

Modify the content within the source/index.html file by updating the text nodes inside the display and script elements. Ensure you maintain the existing class names and animation delays to preserve the motion signature.

What video formats does this template support?▼

The template supports rendering to MP4 and WEBM formats at 60fps. You can specify your preferred format and duration through the provided input parameters during the generation process.

Can I use custom fonts in this video template?▼

Yes, you can add custom fonts by updating the source/fonts.css file and referencing the new font files within the CSS @font-face rules. Ensure all font assets are included in the source directory.

Why does the animation look different in my browser?▼

The template uses CSS keyframes and GSAP-like timing logic designed for the HyperFrames headless renderer. If you are previewing in a standard browser, ensure your environment supports the required CSS animations and font loading.