Remotion 组件库 Skill

To generate Remotion components from a natural language brief, this Skill maps your text requests to an existing component library or creates new compliant React code. It directly outputs ready-to-use Remotion compositions with structured props and Apple-style animations.

Generated Remotion video compositions strictly follow an Apple cinematic design system with predefined constants for colors, fonts, and sizes. They use frame-based spring animations and ban CSS, tailwind animations, and emojis to ensure deterministic and safe output.

You cannot use CSS or Tailwind animations for these technology sci-fi style videos. To guarantee deterministic rendering, the Skill enforces Remotion frame-based spring and interpolate animations, explicitly banning CSS-driven animations and emojis in all generated components.

This Remotion component generator supports existing component matching by selecting from over 18 standardized components for hero titles, terminals, lists, cards, and feature grids. It outputs direct import and usage code when a close match to your intent is found.

The best way to build product feature grids with cinematic transitions in Remotion is describing your intent in natural language. The Skill maps your request to a standardized FeatureGrid component or generates a compliant variant using spring animations and required design constants.

You should not bypass predefined design-system constants when generating Remotion React code if you need strict visual consistency. The Skill enforces required constants like COLORS, FONTS, SIZES, and SPRING_PRESETS to maintain a unified Apple space-storm aesthetic across all generated compositions.