Sea Otter Studio

A still image, plus a loop you only notice on a second look.

Photo by Claudio Schwarz on Unsplash. Smoke clip by Engin Akyurt on Pexels.

The bit that matters

The still is the background. The same clip sits on top, looped and muted, at 40% opacity. If the video never loads, or reduced motion hides it, the photograph is already the hero. For a full guide on how to create this subtle background motion, check out the article Giving a Still Hero a Little Motion with a Low-Opacity Video.

<div class="relative min-h-[60vh] overflow-hidden bg-cover" style="background-image: url(background.jpg)">
  <video autoplay muted loop playsinline class="absolute top-0 right-0 h-full w-full opacity-40">
    <source src="smoke.mp4" type="video/mp4" />
  </video>
</div>
© 2026 Sea Otter Studios All rights reserved.