Extended Module
Reveals
Cinematic wipes and directional clip-path reveals. All implemented with CSS clip-path — no DOM wrappers required. Click any card to replay.
gleam-reveals.css
5 reveals
clip-path animation
cinematic
<!-- Clip-path wipe — no wrapper needed -->
<div class="gleam reveal-wipe-right">...</div>
<!-- Scroll-triggered reveal -->
<div data-gleam="reveal-wipe-right" data-gleam-scroll>...</div>
<!-- JS API for dynamic reveals -->
gleam.animate('.image', 'reveal-curtain', { duration: 800 });Cinematic Reveals — click to replay
Image Reveal on Scroll
Reveal effects shine on images and full-bleed sections. Trigger on scroll with data-gleam-scroll.
<!-- Staggered scroll reveals -->
<img data-gleam="reveal-wipe-right" data-gleam-scroll>
<img data-gleam="reveal-clip-up" data-gleam-scroll data-gleam-delay="150">
<img data-gleam="reveal-curtain" data-gleam-scroll data-gleam-delay="300">