About CinematicIntro

About

Cinematic Intro brings high end motion graphics and professional grade video reveals directly to your Framer projects. It’s designed to transform the first few seconds of a visitor's experience, providing a polished, high production feel to any landing page. Simply drop it into your hero section to showcase your brand with a smooth, physics based logo animation over your choice of background video.

What it does

The component renders a full screen or hero sized video background with a customizable color overlay for better text legibility. It handles complex logo animations using spring physics (stiffness, damping, and mass) for a natural, premium feel. It also manages a timed sequence where the logo appears first, followed by custom text, and finally a "Skip" button. An optional progress bar keeps users informed of the intro length, and the skip button ensures that returning visitors can get straight to your content.

What you can customize

Media & Animation: Upload your own logo and background video. Choose animation styles like the 3D Flip and set the exact width of your logo.
Physics & Feel: Fine tune the "bounce" of your animation by adjusting the Stiffness, Damping, and Mass sliders to get the movement just right.
Timing: Control the sequence of the reveal with independent delay sliders for the overall start, the secondary text, and the action button.
Visual Styling: Full control over the overlay color and opacity, text colors, and button styles. You can even use custom fonts for both the main text and the skip button to ensure it perfectly matches your brand guidelines.