Cinematic background

Show Preview
Cinematic background

About Cinematic background

-----------------------------------------------------------------------------------------------

Add More Premium Components To Your Projects:

Features

  • Real-time cinematic smoke shader powered by WebGL and Three.js

  • Volumetric fog motion with layered fractal turbulence

  • Dynamic god rays and atmospheric light streaks

  • Premium duotone smoke blending with cinematic depth

  • Smooth directional wind simulation and ambient motion

  • Built-in film grain and vignette effects for a cinematic finish

  • Collision-reactive smoke flow around layered content

  • Optimized rendering pipeline for smooth Framer performance

Customization Options

  • Customize smoke, duotone, background, and light colors

  • Control smoke density, scale, and turbulence intensity

  • Adjust wind speed and directional flow angle

  • Fine-tune cinematic light ray brightness

  • Add subtle or heavy film grain overlays

  • Set custom smoke starting positions for composition control

  • Flip smoke orientation horizontally or vertically

  • Toggle live editor preview inside Framer canvas

Use Cases

  • Hero backgrounds for cinematic landing pages

  • Premium SaaS and AI website sections

  • Interactive portfolio visuals

  • Luxury brand presentation layouts

  • Music, gaming, and entertainment websites

  • Atmospheric UI sections and immersive experiences

  • Dark-mode interface backgrounds with motion depth