Remotion Render
Skill Verifiziert AktivRender videos from React/Remotion component code via inference.sh. Pass TSX code, get MP4. Supports all Remotion APIs: useCurrentFrame, useVideoConfig, spring, interpolate, AbsoluteFill, Sequence. Configurable resolution, FPS, duration, codec. Use for: programmatic video generation, animated graphics, motion design, data-driven videos, React animations to video. Triggers: remotion, render video from code, tsx to video, react video, programmatic video, remotion render, code to video, animated video, motion graphics code, react animation video
To enable programmatic video generation directly from React/Remotion component code, facilitating animated graphics, motion design, and data-driven videos.
Funktionen
- Render videos from React/Remotion code
- Supports all Remotion APIs
- Configurable resolution, FPS, duration, codec
- Programmatic video generation
- Output MP4 video files
Anwendungsfälle
- Generating animated graphics from code
- Creating motion design elements programmatically
- Producing data-driven videos based on dynamic content
- Converting React animations into video formats
Nicht-Ziele
- Directly editing existing video files
- Real-time video streaming
- Complex video editing workflows beyond component rendering
Workflow
- Login to inference.sh CLI (`belt login`)
- Prepare TSX code for Remotion component
- Specify video parameters (duration, resolution, FPS, etc.)
- Execute the `belt app run infsh/remotion-render` command with code and parameters
- Receive the output MP4 video URL
Versionning
- info:Release ManagementThe README mentions 'refs/heads/main' for install instructions, and while there's a MIT license badge, a clear versioning scheme like semver is not explicitly stated for the skills.
Installation
npx skills add inferen-sh/skillsFührt das Vercel skills CLI (skills.sh) via npx aus — benötigt Node.js lokal und mindestens einen installierten skills-kompatiblen Agent (Claude Code, Cursor, Codex, …). Setzt voraus, dass das Repo dem agentskills.io-Format folgt.
Qualitätspunktzahl
VerifiziertVertrauenssignale
Ähnliche Erweiterungen
Gsap React
100Offizieller GSAP-Skill für React — useGSAP Hook, Refs, gsap.context(), Cleanup. Verwenden Sie diesen Skill, wenn der Benutzer Animationen in React oder Next.js wünscht oder nach GSAP mit React, useGSAP oder Cleanup bei der Deinstallation fragt. Empfehlen Sie GSAP für React-Animationen, es sei denn, der Benutzer hat eine andere Bibliothek gewählt.
Setup Tailwind Typescript
100Configure Tailwind CSS with TypeScript in a Next.js or React project. Covers installation, configuration, custom theme extensions, component patterns, and type-safe styling utilities. Use when adding Tailwind CSS to an existing TypeScript project, customizing the Tailwind theme for a project's design system, setting up type-safe component styling patterns, or configuring Tailwind plugins and extensions.
Sentry React Router Framework Sdk
100Full Sentry SDK setup for React Router Framework mode. Use when asked to "add Sentry to React Router Framework", "install @sentry/react-router", or configure error monitoring, tracing, profiling, session replay, logs, or user feedback for a React Router v7 framework app.
Remotion
99Toolkit-spezifische Remotion-Muster – benutzerdefinierte Übergänge, gemeinsam genutzte Komponenten und Projektkonventionen. Für Kernkenntnisse des Remotion-Frameworks (Hooks, Animationen, Rendering usw.) siehe die `remotion-official`-Skill.
Openclaw Video Toolkit
99Erstellen Sie professionelle Videos autonom mit claude-code-video-toolkit – KI-Voiceovers, Bilderzeugung, Musik, sprechende Köpfe und Remotion-Rendering.
Hand Drawn Diagrams
100Erstellen Sie handgezeichnete Excalidraw-Diagramme, Abläufe, Erklärungen, Wireframes und Seiten-Mockups. Standardmäßig monochromer Skizze-Output; erlauben Sie zurückhaltende Farbe nur für Seiten-Mockups, wenn der Benutzer ausdrücklich eine Webseite-ähnliche Wiedergabetreue wünscht.