Demos

Our curated collection of 500+ free demos, prototypes, animations, templates, layouts, UI styles, and experimental design concepts. Download and use freely under MIT.

From our sponsor

Create a Penpot plugin Nov 15-Dec 15 and win cash prizes!

From our sponsor

Turn your creations into recurring revenue by selling templates on the Wix Studio Marketplace.

page-transition scroll

Large Image to Content Page Transition

2 years ago by Manoela Ilic

grid page-transition

Tiny Grid Layout Animation

2 years ago by Manoela Ilic

page-transition

How to Create a Cover Page Transition

2 years ago by Manoela Ilic

Make Way Grid Effect

2 years ago by Manoela Ilic

morphing scroll shape svg

How to Animate SVG Shapes on Scroll

2 years ago by Manoela Ilic

Scroll Animation Ideas for Image Grids

2 years ago by Manoela Ilic

grid page-transition

Image To Grid Transition

3 years ago by Manoela Ilic

menu page-transition slideshow

Stack to Content Layout Transition

3 years ago by Manoela Ilic

intro page-transition

Image Trail Animation for an Intro

3 years ago by Manoela Ilic

3d game three.js webgl

How to Add More Fun to a Game: Extending “The Aviator”

3 years ago by Michel Helms

repetition scroll typography

On-Scroll Text Repetition Animation

3 years ago by Manoela Ilic

page-transition svg

Sketch 022: SVG Path Page Transition (Horizontal)

3 years ago by Manoela Ilic

page-transition svg

Sketch 021: SVG Path Page Transition (Vertical)

3 years ago by Manoela Ilic

distortion filter svg

Sketch 020: Image Motion Effect with SVG Filter

3 years ago by Manoela Ilic

distortion filter svg

Sketch 019: Image Motion Effect with SVG Filter

3 years ago by Manoela Ilic

cursor distortion filter svg

Sketch 018: Custom Cursor (two circles with filter and delays)

3 years ago by Manoela Ilic

cursor distortion filter svg

Sketch 017: Custom Cursor (stroke circle with filter effect)

3 years ago by Manoela Ilic

cursor distortion filter svg

Sketch 016: Custom Cursor (filled circle with filter effect)

3 years ago by Manoela Ilic

cursor filter motion-trail svg

Sketch 015: Custom Cursor (multiple circles with filter effect)

3 years ago by Manoela Ilic

cursor filter svg

Sketch 014: Custom Cursor (filter effect and delayed motion)

3 years ago by Manoela Ilic

cursor filter svg

Sketch 013: Custom Cursor (two circles with filter effect)

3 years ago by Manoela Ilic

Sketch 012: Custom Cursor (two circles, one filled)

3 years ago by Manoela Ilic

Sketch 011: Custom Cursor (One Circle)

3 years ago by Manoela Ilic

distortion filter hover page-transition typography

Lines to Content Layout Animation

3 years ago by Manoela Ilic

menu typography

Letter Shuffle Animation for a Menu

3 years ago by Manoela Ilic

menu page-transition

Expanding Rounded Menu Animation

3 years ago by Manoela Ilic

3d hover motion-trail repetition stack

Sketch 010: Image Motion Trail (Perspective)

3 years ago by Manoela Ilic

3d hover motion-trail repetition stack

Sketch 009: Image Motion Trail (Perspective)

3 years ago by Manoela Ilic

hover motion-trail repetition stack

Sketch 008: Image Motion Trail (Circle)

3 years ago by Manoela Ilic

hover motion-trail repetition stack

Sketch 007: Image Motion Trail (Rotation)

3 years ago by Manoela Ilic

hover motion-trail repetition stack

Sketch 006: Image Motion Trail (Semi-transparent)

3 years ago by Manoela Ilic

hover motion-trail repetition stack

Sketch 005: Image Motion Trail (Opaque)

3 years ago by Manoela Ilic

noise three.js webgl

Creating a Risograph Grain Light Effect in Three.js

3 years ago by Robin Payot

minze web-components

Creating Native Web Components

3 years ago by Sergej Samsonenko

« Previous 1 2 3 4 5 6 … 16 Next »

All demo authors

Would you like to join us as a contributor? Let us know.