hyperframes-cli

Scaffold, lint, preview, and render HyperFrames video projects.

364|53|Updated May 9, 2026
One-click install
npx skills add https://github.com/cosmicstack-labs/mercury-agent-skills --skill hyperframes-cli-cosmicstack-labs
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: hyperframes-cli
Source: https://github.com/cosmicstack-labs/mercury-agent-skills/tree/main/categories/development/hyperframes-cli
Command: npx skills add https://github.com/cosmicstack-labs/mercury-agent-skills --skill hyperframes-cli-cosmicstack-labs

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

It streamlines the HyperFrames development loop so you can go from project scaffolding to linted, inspected, hot-reloaded previews and final MP4/WebM renders without wrestling with environment issues.

Core Features & Use Cases

  • Project scaffolding: Generate a working HyperFrames project layout with templates, optional media inputs, and non-interactive/CI-friendly setup.
  • Validation before rendering: Run linting and timeline-aware inspection to catch layout issues like overflow, clipping, and escaping elements.
  • Fast iteration and troubleshooting: Preview with hot reload, render with quality/fps/format controls, and use doctor/browser/info/upgrade when the build/render environment breaks.
  • Use Case: You need to deliver a motion-graphics video quickly; you scaffold a new project, author composition content, lint/inspect for layout problems, preview in the browser, then render a draft-to-final MP4 or WebM for delivery.

Quick Start

Use hyperframes-cli to create, validate, and render a video project by running npx hyperframes init, then npx hyperframes lint and npx hyperframes render in the project directory.

Frequently Asked Questions about hyperframes-cli

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

FAQPage Schema
How do I scaffold and render a motion-graphics video project from start to finish?

To scaffold and render a video project, run npx hyperframes init to generate the layout, author your HTML compositions, validate with lint and inspect commands, preview with hot reload, then render final MP4 or WebM outputs.

What do I need to run HyperFrames CLI for video rendering and linting?

You need Node.js version 22 or higher and FFmpeg installed to run HyperFrames CLI for video rendering, composition linting, and environment troubleshooting using its doctor and upgrade commands.

How does timeline inspection validate HTML compositions before video rendering?

Timeline inspection validates HTML compositions by detecting layout issues like overflow, clipping, and escaping elements before video rendering, providing machine-readable JSON modes for automated lint and inspect checks.

Can I control the fps and quality tier when rendering MP4 or WebM files?

Yes, you can control fps, quality tier, and output format when rendering MP4 or WebM files, applying structured quality controls to ensure the final video encoding meets your delivery specifications.

Why does my video rendering environment break and how do I troubleshoot it?

To troubleshoot a broken video rendering environment, use the doctor, browser, and info commands to diagnose issues, or run the upgrade command to fix build and render dependencies automatically.

Does HyperFrames CLI support CI-friendly project scaffolding for automated video generation?

Yes, HyperFrames CLI supports non-interactive, CI-friendly project scaffolding to generate working video project layouts with templates and optional media inputs for automated video generation pipelines.