ContentMédio

Create Remotion Geist Video

porvercel-labs·vercel-labs· v1.0.0 · atualizado em 2026-04-10

Score

Create Remotion videos using the Geist design system aesthetic. Use when asked to create videos, animations, or motion graphics that should follow Vercel's visual style - dark theme, spring animations, Geist typography, and the Geist color palette.

remotionvercelgeist-uimotion-graphicsvideo-creationdesign-systemanimation

Linguagens

TypeScriptJavaScriptCSS

0Stars

0Forks

0Usos

Fork

Documento do Skill

SKILL.mdcreate-remotion-geist/workflow

Scaffold Project: — Create project directory and initialize npm.

Install Dependencies: — Install Remotion, Tailwind, React, Geist UI, and related packages.

Configure Project: — Set up `remotion.config.ts`, `tailwind.config.js`, and `src/styles.css`.

Create Root Component: — Implement `src/index.tsx` and `src/Root.tsx` for root composition.

Build Scenes: — Develop individual video scenes using Geist design tokens and animation utilities.

Preview Video: — Use `npx remotion studio` to preview the video in a browser.

Render Video: — Use `npx remotion render` to generate the final video file.

Telemetria de Agentes

Execuções

total

Taxa de Sucesso

últimos 30d

Latência Média

0.0s

p50

Alucinação

0.0%

detecção

Tokens Entrada

avg 0/exec

Tokens Saída

avg 0/exec

Uso por Plataforma

Skills Relacionados

Depende deTypeScript Code Style Guide

Similar aGame UI/UX Designer

60%

Árvore do Skill

Create Remotion Geist Video

create-remotion-geist

Fases Cognitivas5

1.SENSE

2.CONTEXTUALIZE

3.ACT

4.EVALUATE

5.REFLECT

Triggers7

create a Remotion video with Geist designmake a video in the Vercel styleanimate something using Geist typography and colorsbuild motion graphics with Geist's dark themegenerate a video using the Geist design systemcreate a video that looks like Vercel's marketing materialsproduce a Remotion animation with the Geist aesthetic

Avaliar este Skill

Score Breakdown

⭐Avaliação Humana0%

🤖Sucesso de Agentes0%

🕐Atualidade100%

🔗Saúde de Dependências100%

🕸️Centralidade no Grafo0%

🛡️Segurança50%

CompositeScore = α·Humano + β·Agente + γ·Recência + δ·Deps + ε·Centralidade + ζ·Segurança

Instalação

$ synaptic mcp download create-remotion-geist

$ synaptic skills detail create-remotion-geist

$ synaptic skills live create-remotion-geist

Dependências

remotion @remotion/cli @remotion/tailwind react react-dom tailwindcss typescript @types/react @geist-ui/icons prism-react-renderer

Links

GitHub Repository