Skeleton Shimmer Loader
A feed of three note cards loads as grey skeleton bones — avatar, two lines, an image block and three text lines — with one diagonal light band sweeping each card; once loaded the bones fade and the real content rises in card by card.
- Preloaders
- gsap
- beginner
- light perf
- mobile: full
- reduced-motion ✓
AI prompt
Recreate this effect with any AI tool
Paste into Claude, Cursor, v0, Lovable or Bolt. 1129 words of exact values — rewritten live as you tune the Playground.
Prompts are for subscribers
Subscribe to copy this prompt in every format, rewritten live to match your Playground settings.
Loading prompt…
Couldn’t load the prompt
Check your connection and try again.
Source
Full source code
Source code is for subscribers
Subscribe to read, copy and download the full HTML, CSS and JavaScript of this demo.
Loading source code…
Couldn’t load the source code
Check your connection and try again.
light Percentage Ring Preloader
A hairline SVG ring draws from 0 to 100% around a tabular serif counter; at 100 the ring swells to 14× and fades, the number slides out of its mask, and a simple page appears as its headline lines rise one after another. Replay included.
- gsap
- svg
light Word Cycle Preloader
Five brand words slide up through a mask one after another — each arriving and leaving with a slight blur over a thin progress line — then the last word stays, scales via Flip into the page headline's exact position and the rest of the page rises beneath it.
- gsap
- flip
light Counter Preloader with Split Reveal
A full-screen preloader counts 0→100 in a huge serif numeral while a hairline fills; the number and label slide out of their masks, two panels split open and the hero headline rises as its image settles from 1.15 to 1.
- gsap
- splittext
light Morphing SVG Preloader
A glowing SVG form morphs circle → square → blob → star → mark while a hairline outline traces each new shape and a percentage climbs; at 100% the form scales 40× to fill the viewport and fades into the page.
- gsap
- svg