Locked

Hello 👋

Welcome to the demo Vault

Try it for free

We couldn't found a match for "hello"

Locked

Cursor Coordinates

Cursor CoordinatesTrack Mouse Position

Locked

Elastic Pulse Button (Bouncy)

Elastic Pulse Button (Bouncy)Blob, Spring

Locked

Falling Text with Gravity

Falling Text with GravityPhysics, Heading

Locked

Draw Random Underline

Draw Random UnderlineGSAP, DrawSVG

Locked

Masked Text Reveal (GSAP SplitText)

Masked Text Reveal (GSAP SplitText)Heading, ScrollTrigger

Locked

Glowing Interactive Dots Grid

Glowing Interactive Dots GridGSAP, Inertia

Locked

Morphing Play/Pause (GSAP MorphSVG)

Morphing Play/Pause (GSAP MorphSVG)Video, Player, Toggle

Locked

Horizontal Scrolling Sections

Locked

Opening Hours (Timetable)

Opening Hours (Timetable)Open, Closed, Store, Restaurant

Locked

3D Perspective Hover

3D Perspective HoverRotate, Tilt, Mousemove

Locked

Footer Parallax Effect

Footer Parallax EffectLayers, Scrolltrigger

Locked

Parallax Image Layers

Locked

Gallery to Overlay Transition (GSAP Flip)

Gallery to Overlay Transition (GSAP Flip)GSAP, Flip, Transition, Overlay, List

Locked

Draggable Infinite Slider (GSAP Draggable)

Draggable Infinite Slider (GSAP Draggable)Swipe, Gallery

Locked

Pixelated Page Transition

Pixelated Page TransitionPixels, Stagger

Locked

Side Navigation with Wipe Effect

Side Navigation with Wipe EffectMenu

Locked

Dynamic Custom Text Cursor (Edge Aware)

Dynamic Custom Text Cursor (Edge Aware)Hover, Mouse

Locked

Apple Dock Navigation Bar

Apple Dock Navigation BarMenu, Grow

Locked

Dynamic Current Year

Dynamic Current YearCopyright

Locked

Looping Words with Selector

Locked

Pixelated Image Reveal

Pixelated Image RevealHover

Locked

Osmo Scaling System

Osmo Scaling SystemCSS, Calc, Fluid

Locked

Layout Grid Flip

Layout Grid FlipView Toggle Switch

Locked

Social Share Buttons

Social Share ButtonsClipboard, Copy, Link

Locked

Swiper Slider Setup

Swiper Slider SetupCarousel, Cards

Locked

Countdown

CountdownTime, Date

Locked

Magnetic Cursor

Magnetic CursorMouse Follower

Locked

Custom Bunny HLS Lightbox (Advanced)

Custom Bunny HLS Lightbox (Advanced)HTML Player, Video

Locked

Bunny HLS Background Video

Bunny HLS Background VideoHTML Player, Video

Locked

Custom Bunny HLS Player (Basic)

Custom Bunny HLS Player (Basic)HTML Player, Video

Locked

Logo Reveal Loader

Locked

Custom Bunny HLS Player (Advanced)

Custom Bunny HLS Player (Advanced)HTML Player, Video

Locked

Sticky Features

Locked

Accelerating Globe on Scroll

Accelerating Globe on ScrollEarth

Locked

Button with Slanted Reveal

Locked

Cursor with Marquee Effect

Cursor with Marquee EffectGSAP

Locked

Stacking Cards Parallax

Stacking Cards ParallaxOverlap, Sticky

Locked

Multi Filter Setup (Multi Match)

Multi Filter Setup (Multi Match)Sort, Grid, Tiles, List

Locked

Basic Filter Setup (Multi Match)

Basic Filter Setup (Multi Match)Sort, Grid, Tiles, List

Locked

Elements Reveal on Scroll

Locked

Pixelate Image Render Effect

Pixelate Image Render Effectscroll, reveal

Locked

3D Image Carousel

3D Image CarouselDraggable

Locked

Directional List Hover

Directional List HoverGrid

Locked

Image Preview Cursor Follower

Locked

Logo Wall Cycle

Logo Wall CycleGSAP, Flip, Swap

Locked

Masonry Grid

Masonry GridPinterest

Locked

Flick Cards Slider

Flick Cards SliderGSAP, Draggable

Locked

Back To Top Button

Locked

Face Follow Cursor (Mascot)

Face Follow Cursor (Mascot)GSAP, Mouse, Illustration, Sun, Eyes

Locked

Multilevel Navigation

Multilevel Navigationmega menu, dropdown

Locked

Momentum Based Hover (Inertia)

Momentum Based Hover (Inertia)Mouse, Movemement, GSAP

Locked

Tilting Bouncing Button

Locked

Basic GSAP Slider (Watch CSS)

Basic GSAP Slider (Watch CSS)Draggable, Inertia, Swipe, Drag

Locked

Follow SVG Path on Scroll

Locked

Locomotive Smooth Scroll Setup

Locomotive Smooth Scroll SetupLenis, Parallax

Locked

Lottie Setup

Lottie SetupAnimation

Locked

Custom Cursor (CSS)

Custom Cursor (CSS)Pointer, Hover, Mouse

Locked

Play Video on Hover (Lazy)

Play Video on Hover (Lazy)Bunny

Locked

WhatsApp Modal (Generate QR Code)

WhatsApp Modal (Generate QR Code)Scan, Kjua

Locked

Stacked Cards Slider

Stacked Cards SliderGSAP, Draggable, Flick, Shuffle

Locked

Global Parallax Setup

Locked

Highlight Text on Scroll

Highlight Text on ScrollSplitText, Heading, Reveal

Locked

Welcoming Words Loader

Welcoming Words LoaderLoading, Hello

Locked

404 Error Minigame

404 Error MinigameRocket, Destroy, Inertia, Draggable

Locked

Javascript Toggle (Attributes)

Javascript Toggle (Attributes)Navigation, Menu

Locked

Centered Scaling Navigation Bar

Centered Scaling Navigation BarMenu

Locked

Display Count

Display CountTotal, Number

Locked

Draggable Stickers

Draggable StickersMove

Locked

Custom Vimeo Lightbox (Advanced)

Custom Vimeo Lightbox (Advanced)Video, Modal, Pop-up

Locked

Sticky Title Scroll Effect

Sticky Title Scroll EffectText Reveal

Locked

Scaling Element on Scroll (GSAP Flip)

Scaling Element on Scroll (GSAP Flip)Transform, Scrolltrigger, Video

Locked

Copy Email to Clipboard Button

Copy Email to Clipboard ButtonContact, CTA

Locked

Falling 2D Objects (MatterJS)

Falling 2D Objects (MatterJS)Smiley, Gravity, Physics

Locked

Centered Looping Slider

Centered Looping SliderCarroussel, Swipe, Cards, Ticker

Locked

One-page Progress Navigation

One-page Progress NavigationMenu, Anchor, Steps

Locked

Button with Rotating Icon

Locked

Parallax Image Gallery with Thumbnails

Parallax Image Gallery with Thumbnailsslider, caroussel, swiper

Locked

Scaling Hamburger Navigation

Scaling Hamburger NavigationMobile, Menu

Locked

Before/After Split Slider

Before/After Split SliderCompare, Splitter

Locked

Play/Pause Video on Scroll

Play/Pause Video on ScrollScrolltrigger, Bunny

Locked

Skeleton Loader Text

Skeleton Loader TextGhost, Reveal

Locked

Flickity Slider Setup (Watch CSS)

Flickity Slider Setup (Watch CSS)Carousel, Swipe, Cards

Locked

Interactive Pixel Grid

Interactive Pixel GridMouse Trail

Locked

CSS Marquee

CSS MarqueeLooping, Banner, Ticker

Locked

Velocity Based Custom Cursor

Velocity Based Custom CursorMouse Follower

Locked

Stop Motion Button (CSS Steps)

Stop Motion Button (CSS Steps)Stagger, Sprite

Locked

Dark/Light Mode with Cookie

Dark/Light Mode with CookieTheme, Toggle, Color, Preference

Locked

Lightbox Setup

Lightbox SetupImage, Modal, Popup

Locked

Audio Player (with Howler.js)

Audio Player (with Howler.js)Music, Sound

Locked

Auto Image Cycle (Slideshow)

Auto Image Cycle (Slideshow)Infinite, Loop, Carousel

Locked

Text Scramble (Load, Scroll, Hover)

Text Scramble (Load, Scroll, Hover)Shuffle, Glitch

Locked

Image Trail Following Cursor

Image Trail Following CursorMouse, Follower

Locked

Basic Filter Setup

Basic Filter SetupSort, Tiles, List, Grid

Locked

Sticky Section Tabs (CSS Only)

Sticky Section Tabs (CSS Only)Accordion, Stacking

Locked

Change Page Title on Leave

Change Page Title on LeaveBrowser

Locked

Vimeo Background Video

Vimeo Background VideoPlayer, Autoplay, Play, Pause, Media

Locked

Tab System with Autoplay Option

Locked

Button with CSS Character Stagger

Button with CSS Character StaggerLink, Click

Locked

Basic Modal Setup

Basic Modal SetupLightbox, Pop-up

Locked

Toggle (CSS Only Trick)

Toggle (CSS Only Trick)Switch

Locked

Live Form Validation (Advanced)

Live Form Validation (Advanced)Input, Textarea, Select, Radio, Checkbox

Locked

Check Section Theme on Scroll

Check Section Theme on ScrollNavigation, Menu

Locked

Burger Menu Button

Burger Menu ButtonLink, Toggle

Locked

Draw On Element with Cursor

Draw On Element with CursorMouse, Follower

Locked

Custom Vimeo Player (Basic)

Custom Vimeo Player (Basic)Video, Pause, Media

Locked

Custom Vimeo Player (Advanced)

Custom Vimeo Player (Advanced)Video, Pause, Media

Locked

Accordion CSS Animation

Accordion CSS AnimationDropdown, FAQ, Question

Locked

Marquee with Scroll Direction

Marquee with Scroll DirectionSlider, Looping, Logos, Bar, Infinite

Locked

Detect Scrolling Direction (Up/Down)

Detect Scrolling Direction (Up/Down)Navigation, Up, Down, Started

Locked

Magnetic Hover Effect

Magnetic Hover EffectButton, Link

Locked

Lenis Scroll-To Anchor Target

Lenis Scroll-To Anchor TargetLocomotive, Smooth, Link

Locked

Lenis Smooth Scroll Setup

Lenis Smooth Scroll SetupLocomotive

Locked

Mouse Cursor Confetti (GSAP Physics2D)

Mouse Cursor Confetti (GSAP Physics2D)Random, Generative

Locked

Dynamic Current Time

Dynamic Current TimeTimezone, Hour, Minutes, Seconds

Locked

Scroll Progress Number

Scroll Progress NumberCounter

Locked

Scroll Progress Bar

Locked

Emoji Rain Effect

Emoji Rain EffectCelebration, Instagram

Locked

Basic Custom Cursor

Basic Custom CursorMouse, Follower

Locked

Directional Button Hover

Directional Button HoverBubble

Locked

Number Loader in 3 Steps

Number Loader in 3 StepsLoading, Percentage

Locked

Button with Bubble Arrow

Button with Bubble ArrowHover, Teleport

Locked

Underline Link Animation

Underline Link AnimationButton

Locked

Live Form Validation (Basic)

Live Form Validation (Basic)Input, Textarea

Locked

Expiring New Badge/Label

Expiring New Badge/LabelDate, Show, Dynamic, Label

Need help?

Join the Osmo Slack Community

Unlock the Osmo Vault

Upgrade toLifetime

Welcome to the demo Vault

Cursor Coordinates

Elastic Pulse Button (Bouncy)

Falling Text with Gravity

Draw Random Underline

Masked Text Reveal (GSAP SplitText)

Glowing Interactive Dots Grid

Morphing Play/Pause (GSAP MorphSVG)

Horizontal Scrolling Sections

Opening Hours (Timetable)

3D Perspective Hover

Footer Parallax Effect

Parallax Image Layers

Gallery to Overlay Transition (GSAP Flip)

Draggable Infinite Slider (GSAP Draggable)

Pixelated Page Transition

Side Navigation with Wipe Effect

Dynamic Custom Text Cursor (Edge Aware)

Apple Dock Navigation Bar

Dynamic Current Year

Looping Words with Selector

Pixelated Image Reveal

Osmo Scaling System

Layout Grid Flip

Social Share Buttons

Swiper Slider Setup

Countdown

Magnetic Cursor

Custom Bunny HLS Lightbox (Advanced)

Bunny HLS Background Video

Custom Bunny HLS Player (Basic)

Logo Reveal Loader

Custom Bunny HLS Player (Advanced)

Sticky Features

Accelerating Globe on Scroll

Button with Slanted Reveal

Cursor with Marquee Effect

Stacking Cards Parallax

Multi Filter Setup (Multi Match)

Basic Filter Setup (Multi Match)

Elements Reveal on Scroll

Pixelate Image Render Effect

3D Image Carousel

Directional List Hover

Image Preview Cursor Follower

Logo Wall Cycle

Masonry Grid

Flick Cards Slider

Back To Top Button

Face Follow Cursor (Mascot)

Multilevel Navigation

Momentum Based Hover (Inertia)

Tilting Bouncing Button

Basic GSAP Slider (Watch CSS)

Follow SVG Path on Scroll

Locomotive Smooth Scroll Setup

Lottie Setup

Custom Cursor (CSS)

Play Video on Hover (Lazy)

WhatsApp Modal (Generate QR Code)

Stacked Cards Slider

Global Parallax Setup

Highlight Text on Scroll

Welcoming Words Loader

404 Error Minigame

Javascript Toggle (Attributes)

Centered Scaling Navigation Bar

Display Count

Draggable Stickers

Custom Vimeo Lightbox (Advanced)

Sticky Title Scroll Effect

Scaling Element on Scroll (GSAP Flip)

Copy Email to Clipboard Button

Falling 2D Objects (MatterJS)

Centered Looping Slider

One-page Progress Navigation

Unlock the
Osmo Vault

Upgrade to
Lifetime