Repolode
pengchujin

pengchujin/livecanvas

An AI coding-assistant skill that turns a sentence into a Live Photo-style animated cover with charts, emoji and timelines, built on Remotion.

Stars
507
Forks
29
Open issues
1
Last commit
11 days ago

What is it?

LiveCanvas is a skill for AI coding assistants such as Codex and Claude Code. Given a sentence describing a topic, it searches and verifies facts, designs a storyboard, renders an animation with Remotion, and produces a preview along with Apple Live Photo assets.

The output can include images, emoji, scenes, timelines and charts, delivered as a designed cover, an MP4, the data sources and an editable project. On Linux, Windows and macOS it can generate paired Apple Live Photo resources using Python 3.10+, Pillow and FFmpeg; macOS also has a native Swift path. The current tooling produces silent H.264 video with JPEG stills.

Installation uses the Skills CLI, with an option to target only Codex. Running the animations requires Node.js, Python 3, FFmpeg and fonts suited to the content.

Key features

  • 01Turns a sentence into an animated cover with a designed layout.
  • 02Supports images, emoji, scenes, timelines and charts.
  • 03Generates Apple Live Photo pairs on Linux, Windows and macOS.
  • 04Exports MP4 previews and editable Remotion projects.
  • 05Installs through the Skills CLI for Codex and other assistants.

Use cases

  • Turning a data trend, such as yearly temperatures, into a shareable animated cover.
  • Making short explainer animations for product comparisons or market figures.
  • Producing Live Photo versions of charts for iPhone sharing.

Quick start

  1. 1

    Install the skill for all your AI assistants with Skills CLI

    npx skills add pengchujin/livecanvas --skill livecanvas -g
  2. 2

    Install the skill only for Codex

    npx skills add pengchujin/livecanvas --skill livecanvas -g -a codex
  3. 3

    Open a new chat and enter a request such as the Beijing and Shanghai temperature example from the README

Things to know

  • Requires Node.js/npm, Python 3, FFmpeg and suitable fonts for rendering.
  • The assistant must be able to search the web and execute code.
  • Native Live Photo output is only fully supported on macOS; other platforms use a portable path with limitations.

Topics

FAQ

What is livecanvas?
An AI coding-assistant skill that turns a sentence into a Live Photo-style animated cover with charts, emoji and timelines, built on Remotion. LiveCanvas is a skill for AI coding assistants such as Codex and Claude Code. Given a sentence describing a topic, it searches and verifies facts, designs a storyboard, renders an animation with Remotion, and produces a preview along with Apple Live Photo assets.
Is livecanvas free to use? What license does it have?
livecanvas is open source under the MIT license. Check the license terms before using it in commercial products.
Is livecanvas still maintained?
Actively maintained. The last commit to livecanvas was on Oct 10, 2026.
What can I use livecanvas for?
Turning a data trend, such as yearly temperatures, into a shareable animated cover. Making short explainer animations for product comparisons or market figures. Producing Live Photo versions of charts for iPhone sharing.
How do I install livecanvas?
Install the skill for all your AI assistants with Skills CLI: npx skills add pengchujin/livecanvas --skill livecanvas -g Install the skill only for Codex: npx skills add pengchujin/livecanvas --skill livecanvas -g -a codex Open a new chat and enter a request such as the Beijing and Shanghai temperature example from the README
Where can I get livecanvas?
The source code and installation instructions are on GitHub: https://github.com/pengchujin/livecanvas

Summary generated by AI from the project's README. GitHub stats refresh daily.

Related projects