Render CLI

npx remotion render remotion/index.tsx PricingCard output.mp4 --codec=h264

Composition code

import { AbsoluteFill, useCurrentFrame, interpolate, Easing } from "remotion";
import { CheckCircle2 } from "lucide-react";

export const PricingCard: React.FC = () => {
  const frame = useCurrentFrame();
  const scale = interpolate(frame, [10, 40], [0.9, 1], { extrapolateLeft: "clamp", extrapolateRight: "clamp", easing: Easing.out(Easing.back(1.2)) });
  const opacity = interpolate(frame, [10, 30], [0, 1], { extrapolateLeft: "clamp", extrapolateRight: "clamp" });

  return (
    <AbsoluteFill style={{ background: "#f5f5f7", fontFamily: '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto', display: "flex", justifyContent: "center", alignItems: "center" }}>
      <div style={{
        transform: `scale(${scale})`, opacity,

Pricing Card

Pricing plan card with animated feature list reveal, highlight badge, and CTA entrance.

SaaS Marketing

Duration8s

Resolution1080 × 1080

Frame rate30 fps

Frames240

Browse all templates

This is a free, open-source template. Copy the code and drop it into your Remotion project.

Related templates

View

Pricing Card

Related templates

Product Launch

SaaS Promo

Testimonial Card