me20.studio ← Back to the shop

Glass Carousel

Your videos on glass cards, with the background moving along. Swipe, drag, use the arrows or tap a card to open it.

What's inside

4 layouts3D ring, coverflow, card stack and fan. Switch with one attribute.
Video or photo cardsOnly the active video plays, the rest wait on a poster. Light on phones.
Living backgroundThe active card's video, blurred behind the glass, changes with every swipe.
Glass playerPrevious, next, autoplay, like and open. Card opens in a glass window.
Made for touchSwipe with fling, vertical page scroll still works, 44 px touch targets.
AccessibleArrow keys, Home/End, Enter, screen-reader labels, reduced motion respected.
<script src="glass-carousel.min.js" defer></script>

<glass-carousel mode="ring" autoplay="5000" ambient>
  <figure data-meta="Brand film">
    <video src="clip.mp4" poster="clip.webp" muted loop playsinline></video>
    <figcaption>Twin heroines</figcaption>
  </figure>
  …
</glass-carousel>

Works in plain HTML, React, Webflow, Framer and WordPress. All films on this page are by me20 Studio.