Photo Video Flip

Photo Video Flip

About Photo Video Flip

What is Photo Video Flip?

Photo Video Flip pairs a static image with an embedded video in a smooth 3D flip card. Front side holds your hero image, title, and subtitle. Click or hover to flip — the back side plays a video with an optional CTA overlay. Ideal for e-commerce product reveals, brand storytelling, agency portfolios, and any layout where you need to pack two media types into a single, interactive card.

Core Features

  • 3D flip animation with adjustable speed and smooth cubic-bezier easing

  • Cursor-tracking 3D tilt effect with spring physics for a premium, responsive feel

  • Full video controls: autoplay on flip, loop, muted, and playback speed

  • Back side overlay with optional title, CTA button, and gradient for text readability

  • 4 built-in themes (Minimal Dark, Minimal Light, Vibrant, Custom) with full color override

  • Separate font controls for title, subtitle, back title, and CTA text

Controls inside Framer

Front Content

  • Photo (responsive image upload)

  • Title

  • Subtitle

Video

  • Video File (drag-and-drop upload)

  • Video URL (external link fallback)

Theme

  • Theme preset selector (Minimal Dark, Minimal Light, Vibrant, Custom)

  • Custom Colors: Card BG, Text Primary, Text Secondary, Video Overlay, Border, CTA Button BG, CTA Button Text

Card Style

  • Corner Radius

  • Inner Padding

  • Shadow Intensity

Video Settings

  • Autoplay on Flip

  • Loop

  • Muted

  • Playback Speed

Back Overlay

  • Show Overlay toggle

  • Overlay Opacity

  • Back Title

  • CTA Text

  • CTA Link

Behavior

  • Flip Trigger (Click / Hover)

  • Flip Speed

  • 3D Tilt toggle

  • Auto Flip Back with configurable delay

Typography

  • Title Font

  • Subtitle Font

  • Back Title Font

  • CTA Font

Best use cases

  • E-commerce product cards that reveal runway or lifestyle video on interaction

  • Agency and portfolio sites showcasing project photos with behind-the-scenes footage

  • SaaS landing pages pairing feature screenshots with product demo videos

  • Event and hospitality pages highlighting venues with promotional video content

One component. Two sides. Add depth and engagement to any Framer page in seconds.

Questions or custom requests?

We design and build custom Framer components. Get in touch at contact@teampixel.com.au.