axi0 Motion 0.2.0 · 295 effects · free
Motion that gives a page life.
Text that moves, cards that answer the pointer, living backgrounds and interface sounds, in small framework-free files with live controls and code for every stack.
Two lines in your page's head
<link rel="stylesheet" href="/axi0/motion/motion.css?v=6">
<script src="/axi0/motion/motion.js?v=10" defer></script>Your system asks for reduced motion: every demo shows its final state and nothing moves.
What's inside
Counted from the library itself each time we publish, so these numbers are always the real ones.
- 295 effects
- 19 text
- 49 interaction
- 34 components
- 32 backgrounds
- 161 sounds
- 2.7 KB loader, gzip
- 0 dependencies
Live, right here
Every tile runs the real effect. It starts when it scrolls into view and stops when it leaves.
Words rise into place, one after another.
Split textEntrances for headings
Star warpStars part around the pointer
Tilt and spotlight
Move the pointer over this card.
TiltCards that lean toward you
2,048 pixels
Count upNumbers that arrive
MagnetButtons with a pull
Color flows through the letters.
Gradient textA moving fill
A light passes over the words.
ShinyA sheen that sweeps by
Text · Interaction · Components · Backgrounds · Sounds ·
MarqueeAn endless line
One library, every stack
The same effect, the same options, wherever you write your pages. The loader keeps watching the page, so an app that renders later works like a static page.
HTML
<h1 data-motion="split-text">
Hello, motion.
</h1>React
import { SplitText } from "./motion/react/SplitText";
<SplitText>Hello, motion.</SplitText>Vue
import SplitText from "./motion/vue/SplitText.vue";
<SplitText>Hello, motion.</SplitText>Plain JavaScript
const el = document.querySelector("h1");
el.dataset.motion = "split-text";Ready for your coding assistant
A skill file you hand to the assistant that writes your code, and a plain index of every effect with its options. It reads them, then marks up your page the way a person would.
Every effect
295 effects in five groups. Each opens on its own page with a live demo, controls and code.
Text 19
- Split textWords, or letters, rise into place one after another the first time the text scrolls into view.Text · 1.3 KB gzip
- Blur textWords, or letters, come into focus out of a soft blur, one after another.Text · 0.1 KB gzip
- Shiny textA band of light sweeps across the text, again and again.Text · 0.4 KB gzip
- Gradient textThe text fills with colors that flow slowly along it.Text · 0.5 KB gzip
- Count upA number counts up to its value when it scrolls into view, in the page's own format.Text · 0.9 KB gzip
- Curve marqueeThe text runs without end along a curve, a gentle arc or a wave on a colored ribbon; drag it to fling it either way.Text · 1.8 KB gzip
- DecodeRandom glyphs cycle under every letter until each one locks into the real text.Text · 1.1 KB gzip
- Dust typeThe text gathers out of drifting dust; the pointer scatters it and a click blows it apart before it settles back.Text · 2.0 KB gzip
- Flip boardA split-flap board: every tile clacks through the letters to the next phrase.Text · 2.0 KB gzip
- Focus frameOne word at a time comes into focus inside gliding corner brackets while the rest stay soft.Text · 1.3 KB gzip
- Lens warpA lens follows the pointer and swells the letters under it, with red and blue fringes at its rim; at rest it drifts across on its own.Text · 1.8 KB gzip
- Outline drawThe letters' outlines draw themselves on, word after word, then flood with color.Text · 1.3 KB gzip
- Ring textThe letters sit around a circle that turns slowly; hovering speeds it up, slows it, pauses it or sends it spinning.Text · 1.4 KB gzip
- Scramble hoverLetters near the pointer break into random glyphs and settle back as it moves on.Text · 1.0 KB gzip
- Slot textEach letter spins through a reel of random glyphs and lands on the real one, one after another.Text · 1.5 KB gzip
- TumbleThe words break loose and tumble into a pile you can drag and throw; click the pile and they fly home.Text · 3.1 KB gzip
- TypewriterTypes the text letter by letter behind a blinking cursor; with phrases it erases each one and types the next.Text · 1.6 KB gzip
- Wire textThe letter under the pointer turns into a dashed vector outline with handles and its size, like a selection in a drawing app; the letters it leaves stay outlined a moment.Text · 2.2 KB gzip
- Word cycleA word cycles through a list, letter by letter, on a colored pill that fits each word.Text · 1.6 KB gzip
Interaction 49
- MagnetAn element leans toward the pointer when it comes near, then settles back.Interaction · 0.8 KB gzip
- Click sparkEach click throws a ring of small sparks from the pointer.Interaction · 1.0 KB gzip
- RevealContent slides and fades into place the first time it scrolls into view.Interaction · 0.7 KB gzip
- Bento glowA grid of cards lit by one light that follows the pointer across them, catching every nearby edge, with a wave of light on click.Interaction · 1.9 KB gzip
- Card fanA fan of cards bounces in; the one under the pointer straightens while the others make room.Interaction · 1.7 KB gzip
- Card pileA pile of cards you drag, flick or click through; a thrown card flies off and tucks back in at the bottom of the pile.Interaction · 2.4 KB gzip
- Color lensGrayscale cards get their color back under a soft lens that follows the pointer.Interaction · 1.7 KB gzip
- CrosshairHairlines follow the pointer with its position and lock onto links and buttons to measure them.Interaction · 2.0 KB gzip
- Cube fieldOutlined 3D cubes turn to face the pointer, spin when swept and ripple on click.Interaction · 2.5 KB gzip
- Dither cloudSoft drifting clouds drawn in ordered-dither pixels, violet to pale lilac as they thicken, that glow up under the pointer and ripple outward on click.Interaction · 0.8 KB gzip
- DodgeChildren slip away from the pointer, then glide home when it rests.Interaction · 1.3 KB gzip
- Edge glowA gradient border glows on the side nearest the pointer, brightest at the edge.Interaction · 1.8 KB gzip
- Electric edgeCrackling strands of current wrap an element and surge near the pointer.Interaction · 2.6 KB gzip
- Fiber tunnelComets of light race down a swirling tunnel of fibers that the pointer steers.Interaction · 1.2 KB gzip
- Flip cardA two-faced card turns over on a click, drag or flick and settles on a spring.Interaction · 1.9 KB gzip
- Foil cardA collectible card tilts toward the pointer while its foil and glitter catch the light.Interaction · 1.9 KB gzip
- Glare sweepA glossy streak of light sweeps across in the direction the pointer moves.Interaction · 1.3 KB gzip
- Glint buttonA glass button whose rim catches the light, with a highlight that glides toward the pointer and drifts round the edge at rest.Interaction · 2.1 KB gzip
- Glow trailLight pours from the pointer, drifts up and cools as it fades.Interaction · 2.2 KB gzip
- Glow webGlowing threads weave across the dark and meet at luminous pinch points; they light up under the pointer and carry pulses of light on click.Interaction · 0.8 KB gzip
- Grain gradientFlowing grainy gradients that the pointer stirs like paint.Interaction · 1.3 KB gzip
- Halftone lensA halftone print of a picture whose dots swell into the real photo under the pointer.Interaction · 2.1 KB gzip
- Halo orbA glowing ring of swirling color breathes slowly, trails an orbiting light round its rim and reaches toward the pointer.Interaction · 0.9 KB gzip
- Image trailPictures appear along the pointer's path and fade behind it, in four styles.Interaction · 1.5 KB gzip
- Jelly dotsA springy dot grid the pointer drags through like jelly, with click shockwaves.Interaction · 2.4 KB gzip
- Light columnA swirling pillar of light ignites, leans toward the pointer and surges on a click.Interaction · 1.4 KB gzip
- Light prismA glass pyramid turns slowly in the dark, its edges glowing in light split into a spectrum; the pointer tilts it toward itself.Interaction · 1.3 KB gzip
- Light raysVolumetric rays pour from an edge; the pointer steers the beam and casts a shadow.Interaction · 1.6 KB gzip
- Light streaksStreaks of light fall down a curved tunnel, bend around the pointer and warp while held.Interaction · 1.4 KB gzip
- LightningA crackling, branching bolt bends toward the pointer and strikes where you click.Interaction · 1.7 KB gzip
- Line swayDense vertical lines sway like silk, bend away from the pointer, glow where they are pushed and spring back into place.Interaction · 1.0 KB gzip
- Melt cardA picture tears and melts as the pointer moves, then pulls itself back together.Interaction · 1.4 KB gzip
- Molten flowSwirling caustic filaments glow from deep violet to white-hot, heat up under the pointer and flare outward on click.Interaction · 0.7 KB gzip
- Near typeLetters grow bolder the closer the pointer comes, and their neighbors slide apart to make room, so the line breathes without moving the page.Interaction · 1.5 KB gzip
- Orbit borderA twinkling star runs the exact outline of any button, pill or card, trailing light and stardust, and speeds up under the pointer.Interaction · 2.9 KB gzip
- Pixel bloomA card fills with twinkling pixels while it is pointed at or focused, rippling out from where the pointer came in, and drains away when it leaves.Interaction · 2.2 KB gzip
- Pixel flurryPixel-art snowflakes drift down in layers of depth, the near ones big and bright, and the pointer brushes them aside as it moves.Interaction · 1.3 KB gzip
- Pixel gooGlossy pixels melt into a goo trail behind the pointer, warming from cream to violet as they age, with drops that drip away.Interaction · 1.1 KB gzip
- Pixel wipeA second picture builds in over the first pixel by pixel, in a springy wave that starts wherever the pointer comes in, and pulls back out the same way.Interaction · 1.7 KB gzip
- Proximity listList items lean out and light up as the pointer passes near them.Interaction · 1.2 KB gzip
- Pulse ringsGlowing rings pulse outward in a slow wave, swell toward the pointer and flare with a shock ring on click.Interaction · 0.8 KB gzip
- Radar sweepA radar scope whose sweep leaves a phosphor afterglow and picks up moving contacts, the pointer among them, with a ping on click.Interaction · 1.5 KB gzip
- Ribbon trailSpringy ribbons chase the pointer, each on its own spring so they part on turns and gather when it rests, in lens, comet or even shapes.Interaction · 1.3 KB gzip
- Shape latticeA drifting grid of squares, circles, triangles or hexagons lights up under the pointer and leaves a fading rainbow trail that drifts with it.Interaction · 1.2 KB gzip
- Snap reticleA reticle follows the pointer, spinning gently, and its corner brackets snap around buttons and links, matching their size and corners.Interaction · 2.2 KB gzip
- Spectral burstA burst of prismatic light rays fans out from a bright core, leans toward the pointer and sends a wave of light outward on click.Interaction · 0.8 KB gzip
- Star rateA star rating whose stars lift in a wave up to the pointer, name the score above it and pop when one is chosen.Interaction · 2.5 KB gzip
- VeilA silky veil of light drifts through the dark and bends around the pointer.Interaction · 1.2 KB gzip
- Wave gridA crisp grid ripples like water around the pointer, bending and lighting up as each wave passes, with a splash ring on click.Interaction · 0.8 KB gzip
Components 34
- CarouselSlides that share one frame and change by slide, fade, scale, flip, stack or depth, with swipes, dots and an autoplay timer that waits while you read.Components · 3.0 KB gzip
- Spotlight cardA soft light follows the pointer across a card.Components · 0.6 KB gzip
- DockA row of icons that swell toward the pointer and part to make room, with labels that rise above them, launch bounces and badges.Components · 2.5 KB gzip
- Tilt cardA card leans toward the pointer in 3D, with a soft glare.Components · 1.0 KB gzip
- MarqueeA row of items scrolls sideways without end and speeds up while the page scrolls.Components · 0.8 KB gzip
- StepperA flow in steps: numbered marks joined by lines that fill, a ring that glides to the current step and panels that slide in from the side they come from.Components · 2.8 KB gzip
- ToastShort messages that stack in a corner, burn a thin fuse for the time they have left, spread out under the pointer and swipe away.Components · 3.0 KB gzip
- Rise navLinks in a pill bar: under the pointer a fill rises through a link while its label rolls over, a dot glides under the current page, and narrow screens get a menu button.Components · 2.2 KB gzip
- Blob navA nav bar whose active pill breaks into drops of goo that flow over to the link you pick.Components · 1.9 KB gzip
- Pop selectA select chip whose list pops open from its corner while the highlight glides from row to row; it drives the real select underneath.Components · 2.8 KB gzip
- Stretch switchA switch whose thumb stretches with its speed and squashes against the end it hits; flick it, drag it or press Space.Components · 1.6 KB gzip
- Burst menuA round menu button that bursts big pill links over its box, each popping in a beat after the last with its own tilt and hover color.Components · 1.8 KB gzip
- Cascade menuA menu button that sweeps colored layers and then a panel in from the side, its numbered links rising one after another.Components · 2.1 KB gzip
- Card drawerA floating nav bar that springs open into a row of cards, each a group of links, revealed by a clip that only repaints.Components · 1.9 KB gzip
- Marquee menuBig menu rows: under the pointer a band slides in from the edge it entered by, carrying a running marquee of the item's name and picture.Components · 1.3 KB gzip
- MasonryPictures in columns of their own heights that rise into place the first time they come into view, glide to new places when the columns change and open full size.Components · 1.6 KB gzip
- Arc galleryPicture cards on the rim of a wide wheel that you drag, flick, scroll sideways or step with the arrow keys; the front one opens full size.Components · 2.0 KB gzip
- Card deckA 3D stack of cards set up and back from one another; on a timer, a fling or Next the front card drops away and slides in at the back.Components · 2.4 KB gzip
- Doc folderA folder whose papers peek out under the pointer and fan out above it when it opens; each paper is a link you can pick.Components · 1.7 KB gzip
- Tick sliderA range slider drawn as a row of fine bars with no thumb; dragging fast raises a wake of taller bars around the handle that settles behind it.Components · 1.2 KB gzip
- Ring dialA dial of fine ticks you turn by angle: the value arc fills behind a bright head that drags a comet tail when you spin it fast.Components · 1.9 KB gzip
- Slide confirmA slide-to-confirm handle: drag it to the end, it spins while the action runs and unfurls into a done pill; Enter or Space confirms from the keyboard.Components · 1.8 KB gzip
- Wheel pickerA curved picker that spins with a drag, the scroll wheel or the arrow keys, tilting the options away from the chosen one; it drives the real select underneath.Components · 2.0 KB gzip
- Tick checkA checkbox row where one spring fills the box, draws the tick and strikes through the label.Components · 1.2 KB gzip
- Swell radioA radio group of chips where the chosen one swells with a wobble and nudges its neighbors outward.Components · 1.1 KB gzip
- SegmentedA segmented control whose thumb stretches across the gap as it travels and squashes into place.Components · 1.2 KB gzip
- Notify toggleA pill toggle: pressing it rings the bell, crossfades the label and floods the pill with color.Components · 1.1 KB gzip
- Hold confirmA button you press and hold to confirm: a fill sweeps across while you hold, drains back if you let go early and fires the action when it is full.Components · 1.2 KB gzip
- Fuse undoAn action button whose done state carries an Undo on a burning fuse; the action commits only when the fuse runs out.Components · 1.5 KB gzip
- Like heartA like button whose heart squeezes to a dot, flips color and bursts back while the count rolls over to the next number.Components · 1.4 KB gzip
- Code inputA one-time code field drawn as slots: digits spring into place as you type or paste, and the slots flash when the code is complete.Components · 1.4 KB gzip
- Frost iconsIcon tiles of frosted glass over a tilted color plate that swings up and lights the glass when you point at or focus them.Components · 1.3 KB gzip
- Tip groupTooltips for a row of icon buttons: the first one waits a beat, then its neighbors open at once while the group is warm, the tip gliding from one to the next.Components · 1.3 KB gzip
- Scrub numberA number field becomes a chip you drag sideways to change, with rubber-band ends and a fill for where the value sits; click it to type.Components · 1.9 KB gzip
Backgrounds 32
- AuroraSoft curtains of colored light drift across a background.Backgrounds · 0.7 KB gzip
- SilkFolds of fabric ripple slowly across a background, with a fine film grain.Backgrounds · 0.7 KB gzip
- ParticlesBalls fall, bounce and collide in a scene computed in WebAssembly.Backgrounds · 1.3 KB gzip
- Blob mergeGlossy liquid blobs drift, merge, stretch and pinch apart; one more follows the pointer through them.Backgrounds · 0.9 KB gzip
- Block warpA picture that breaks into a grid of blocks where the pointer moves and settles back into place.Backgrounds · 1.2 KB gzip
- Chrome poolSoft ribbons of liquid chrome swirl through a pool, catch the light and ripple under the pointer.Backgrounds · 0.8 KB gzip
- Color foldBroad ribbons of glowing color bend and fold across the frame in slow, smooth sweeps.Backgrounds · 0.7 KB gzip
- CRT glowA blocky plasma glows on a curved tube screen with scanlines, phosphor dots, afterglow and a power-on intro.Backgrounds · 1.0 KB gzip
- Dither veilA one-bit dithered picture that the pointer burns through to full color; it knits back cell by cell.Backgrounds · 1.5 KB gzip
- Dot lensA fine field of gradient dots seen through a lens that follows the pointer: it magnifies, pinches or swirls.Backgrounds · 0.7 KB gzip
- Ember eyeA fiery eye with a living iris, a slit pupil that watches the pointer and flames licking outward.Backgrounds · 1.0 KB gzip
- Ferro seaA glossy sea of magnetic fluid: swells of spikes roll in, and the pointer raises a crown of them.Backgrounds · 1.0 KB gzip
- Fiber veilLayered ribbons of fine glowing fibers twist, fold and drift, the far ones soft as if out of focus.Backgrounds · 0.8 KB gzip
- Glass tilesA rolling field of glossy rounded tiles in perspective, lit by two colored lights that drift across it.Backgrounds · 1.0 KB gzip
- Ink flowA glowing liquid swirls under the pointer in a real fluid simulation, colored by how fast it flows.Backgrounds · 1.5 KB gzip
- Lift fieldA field of particles that lifts into a glowing ring around the pointer and bursts outward on a click.Backgrounds · 1.1 KB gzip
- Light roadA night highway of glowing light trails on a winding road; press and hold to warp into hyperspace.Backgrounds · 1.2 KB gzip
- Liquid cursorA liquid blob follows the pointer, stretches and sloshes behind it and throws droplets, in four materials.Backgrounds · 1.4 KB gzip
- Live wireTurns a word or a logo into a living lightning outline, with arcs that leap off its edges toward the pointer.Backgrounds · 1.5 KB gzip
- Needle fieldA field of short needles that swing toward the pointer like compass needles, ripple outward and spin on click.Backgrounds · 0.8 KB gzip
- Oil filmA liquid film of soft rainbow folds that shifts on its own and ripples where the pointer moves.Backgrounds · 0.7 KB gzip
- Paint swirlThick paint swirls around the middle in crisp pixels; the pointer stirs it and a click spins a whirlpool.Backgrounds · 0.8 KB gzip
- Plasma ribbonsTwo glowing ribbons of plasma curl through each other, twisting as they go, with white-hot cores.Backgrounds · 0.8 KB gzip
- Polar lightsSoft bands of northern lights drift across the frame in slowly cycling colors, with rays that flicker upward.Backgrounds · 0.8 KB gzip
- Shape tideA field of circles, squares and triangles that brighten and grow as rolling waves pass through it.Backgrounds · 0.8 KB gzip
- Slat seaA wall of tiny slats tips over into a rolling sea in perspective, with glints on every crest.Backgrounds · 0.9 KB gzip
- Smoke trailA ghost of glowing smoke floats after the pointer and curls away as it rises and fades.Backgrounds · 0.9 KB gzip
- Star warpAn endless flight through twinkling stars that jumps to warp now and then; stars part around the pointer.Backgrounds · 1.2 KB gzip
- Storm orbA glass orb with a crackling electric rim and glowing dust inside that swirls with the pointer.Backgrounds · 1.0 KB gzip
- SwarmA liquid swarm of particles flows after the pointer, curls into eddies and pours around buttons.Backgrounds · 1.3 KB gzip
- Tile wallA tilted wall of gradient tiles drifts in alternating rows, slides with the pointer and lights up where it rests.Backgrounds · 0.8 KB gzip
- Water rippleWater ripples spread from the pointer, warp the picture under them and leave a wake that fades.Backgrounds · 1.7 KB gzip
Sounds 161
- Mute switchA button that mutes and unmutes every sound on the page, in memory only, so a reload starts fresh.Sounds · 0.2 KB gzip
- Round tapA soft round tap with a warm body, for primary buttons.Sounds · 0.1 KB gzip
- Tiny tickA tiny, gentle tick for small controls such as icons and chips.Sounds · 0.1 KB gzip
- Metal tapA small, bright metallic tap for links and icon buttons.Sounds · 0.1 KB gzip
- Air tapA breathy, toneless tap for quiet, minimal interfaces.Sounds · 0.1 KB gzip
- Felt pressA muted, padded press for quiet secondary buttons.Sounds · 0.1 KB gzip
- Cushion pressA cushioned press that springs back, for cards and large buttons.Sounds · 0.2 KB gzip
- Glass beadA small glassy ping for picking one item from a set.Sounds · 0.1 KB gzip
- Marble clickA smooth glassy click for carousels and pickers.Sounds · 0.2 KB gzip
- Pure dotA pure, minimal tone for radio buttons and dots.Sounds · 0.1 KB gzip
- Rubber boopA playful, rubbery pop for friendly buttons.Sounds · 0.1 KB gzip
- Mouth popA round mouth pop for playful motion graphics.Sounds · 0.1 KB gzip
- Wood tockA dry little woodblock knock for checking a box.Sounds · 0.1 KB gzip
- String pluckA soft plucked string for picking from a list.Sounds · 0.1 KB gzip
- Step tickA soft plucked tick for each step completed.Sounds · 0.1 KB gzip
- Warm confirmA warm, open fifth for choosing a card.Sounds · 0.1 KB gzip
- Two petalsTwo light notes for picking a swatch or a card.Sounds · 0.1 KB gzip
- Switch clickA soft two-step click that turns a switch on, and its mirror that turns it off.Sounds · 0.2 KB gzip
- Rocker switchA sturdy two-part click for big switches, lower on the way off.Sounds · 0.2 KB gzip
- Spring toggleA playful springy wobble for fun toggles, bending up for on and down for off.Sounds · 0.2 KB gzip
- Detent notchA soft detent for steppers, sliders and tabs.Sounds · 0.1 KB gzip
- Tuned stepA tiny tuned detent for volume and value steps.Sounds · 0.1 KB gzip
- Tab flickA crisp little flick for switching tabs.Sounds · 0.1 KB gzip
- Tab glideA smooth, rounded slide for moving between tabs.Sounds · 0.1 KB gzip
- SealA soft, settled click for saving and locking.Sounds · 0.1 KB gzip
- UnlockA soft click that opens into air, for unlocking.Sounds · 0.2 KB gzip
- Plug in, plug outA rounded click and rise for connecting a device, and the fall and click for letting it go.Sounds · 0.2 KB gzip
- Light and darkA bright little rise for switching to light mode and a soft settle for dark.Sounds · 0.2 KB gzip
- Expand and collapseA soft flutter that opens a section, and the matching one that tucks it away.Sounds · 0.2 KB gzip
- Power on, power offA rising glow for powering on or connecting, and a falling fade for powering off.Sounds · 0.2 KB gzip
- Menu liftA tiny lift for opening menus and popovers.Sounds · 0.1 KB gzip
- Grid snapA quick pull and a crisp snap onto a grid or a slot.Sounds · 0.2 KB gzip
- Record start and stopA clear double beep when recording starts and a falling pair when it stops.Sounds · 0.2 KB gzip
- Play and pauseA quick spin up for starting playback and a soft spin down for pausing.Sounds · 0.2 KB gzip
- BloomTwo warm notes that rise into a quiet success.Sounds · 0.1 KB gzip
- CrestA brighter four-note lift for bigger wins.Sounds · 0.2 KB gzip
- SettleA single warm note that quietly says done.Sounds · 0.1 KB gzip
- SummitA quick climbing run that opens into a chord when everything is complete.Sounds · 0.2 KB gzip
- CoinA bright two-note coin for rewards and points.Sounds · 0.1 KB gzip
- SparkleA quick sparkle for small wins.Sounds · 0.2 KB gzip
- Heart pulseA warm double pulse for likes and favorites.Sounds · 0.2 KB gzip
- Reaction popA bright little pop for adding a reaction.Sounds · 0.1 KB gzip
- Level upA rising power-up for leveling up.Sounds · 0.2 KB gzip
- Wooden runA quick wooden run for keeping a streak alive.Sounds · 0.1 KB gzip
- TreasureA warm thump that opens into a shimmering chord.Sounds · 0.2 KB gzip
- ConfettiA soft pop and a shower of sparkles for celebrations.Sounds · 0.2 KB gzip
- AcceptA smooth rising tick for accepting a suggestion.Sounds · 0.2 KB gzip
- SendA quick airy lift for sending a message.Sounds · 0.2 KB gzip
- Read receiptTwo tiny ticks for delivered and read.Sounds · 0.2 KB gzip
- Upload doneA rising breath and a bright ping when an upload finishes.Sounds · 0.2 KB gzip
- Download doneA falling breath that lands softly when a download finishes.Sounds · 0.2 KB gzip
- ShakeA quick, muted shake for input that does not fit.Sounds · 0.2 KB gzip
- Not quiteA gentle falling pair that says not quite.Sounds · 0.1 KB gzip
- CrunchA crunchy digital hit for errors in tech scenes.Sounds · 0.2 KB gzip
- BlockedA low, firm double buzz for an action that is blocked.Sounds · 0.1 KB gzip
- Low powerA dim, flickering tone for low battery and fading power.Sounds · 0.2 KB gzip
- Alert pulseA clear repeating pulse for time-sensitive alerts.Sounds · 0.1 KB gzip
- NudgeA soft double tap that asks for attention.Sounds · 0.1 KB gzip
- Spring backA springy return when a drag is canceled.Sounds · 0.1 KB gzip
- UndoA soft little rewind for undo and revert.Sounds · 0.2 KB gzip
- Three bellsThree soft bells for a new notification.Sounds · 0.2 KB gzip
- Clear pingOne clear bell with a quiet tail.Sounds · 0.1 KB gzip
- DingA clean bell ding for highlights.Sounds · 0.1 KB gzip
- Chat bubbleTwo round notes for a message in an open chat.Sounds · 0.1 KB gzip
- IncomingTwo round blips for an incoming message.Sounds · 0.1 KB gzip
- MentionA clear rising pair for when someone mentions you.Sounds · 0.2 KB gzip
- KalimbaA plucked kalimba pair for friendly notifications.Sounds · 0.2 KB gzip
- Wooden reminderA mellow wooden pair for calm reminders.Sounds · 0.2 KB gzip
- HintA neutral, airy tone for tips and info.Sounds · 0.1 KB gzip
- Coming upA gentle three-note rise for upcoming events.Sounds · 0.1 KB gzip
- Someone joinedA soft vibraphone two-tone for someone joining.Sounds · 0.2 KB gzip
- Join callA warm rising chord for joining a call.Sounds · 0.2 KB gzip
- Typing dotsThree faint dots for someone typing.Sounds · 0.1 KB gzip
- CountdownThree beeps and a go, for starts and launches.Sounds · 0.2 KB gzip
- Clock tickA dry clock tick for countdowns and timers.Sounds · 0.1 KB gzip
- FocusA small focus whir and two confirm beeps for emphasis.Sounds · 0.2 KB gzip
- ShutterA soft mechanical shutter for photos and screenshots.Sounds · 0.2 KB gzip
- SwishA short, airy swipe for sliding panels.Sounds · 0.1 KB gzip
- Sheet openA soft rise for opening a sheet or a modal.Sounds · 0.2 KB gzip
- Sheet closeA falling breath for closing and dismissing.Sounds · 0.2 KB gzip
- DrawerA sliding glide that lands with a soft stop.Sounds · 0.2 KB gzip
- Flick awayA very short flick for swiping something away.Sounds · 0.1 KB gzip
- Page turnA soft paper turn for pages and steps.Sounds · 0.2 KB gzip
- ShuffleA light double slide for reordering items.Sounds · 0.1 KB gzip
- Fly byA light, quick pass from one side to the other.Sounds · 0.2 KB gzip
- GustA full, soft whoosh that passes from left to right.Sounds · 0.2 KB gzip
- GaleA heavy, wide whoosh with low weight under it.Sounds · 0.2 KB gzip
- SwoopA fast, deep swoop with a tonal edge.Sounds · 0.2 KB gzip
- SpinA whirling whoosh that circles around.Sounds · 0.1 KB gzip
- SilkA smooth, silky swish like fabric.Sounds · 0.2 KB gzip
- WhipA sharp, quick whip for snappy cuts.Sounds · 0.2 KB gzip
- Twin passTwo quick passes, one after the other.Sounds · 0.1 KB gzip
- DriftA slow, airy pass with a gentle tail.Sounds · 0.1 KB gzip
- Tonal wipeA clean tonal sweep for wipes and slides.Sounds · 0.1 KB gzip
- Zoom inA punchy zoom-in with a tonal rise and a landing.Sounds · 0.2 KB gzip
- Step forwardA light step up for next and forward.Sounds · 0.1 KB gzip
- Step backA light step down for back and previous.Sounds · 0.1 KB gzip
- Dive inA quick dip for drilling into a folder.Sounds · 0.2 KB gzip
- Pick upA soft lift as an item is picked up.Sounds · 0.2 KB gzip
- Put downA gentle landing as an item is put down.Sounds · 0.1 KB gzip
- StackA soft cascade as items stack together.Sounds · 0.2 KB gzip
- BannerA clean sweep and a click for lower thirds and banners.Sounds · 0.2 KB gzip
- Title slideA short tonal slide that lands, for titles moving in.Sounds · 0.1 KB gzip
- Ready glowA faint glow when a drop target is ready or a pointer arrives.Sounds · 0.1 KB gzip
- Laptop keysLaptop key presses with a slightly different take on every keystroke.Sounds · 0.2 KB gzip
- Deep keysDeeper key presses with a rounded, muted body.Sounds · 0.2 KB gzip
- Low keysLight, low-profile key taps like a thin modern keyboard.Sounds · 0.2 KB gzip
- Typewriter keysCrisp mechanical key clicks for type-on titles.Sounds · 0.2 KB gzip
- Enter keyA key press that lands with a soft confirm, for Enter and submit.Sounds · 0.2 KB gzip
- Erase keyA softer key with a little sweep, for delete and backspace.Sounds · 0.2 KB gzip
- TickerRapid soft ticks for text that appears letter by letter.Sounds · 0.2 KB gzip
- Counting ticksFast rising ticks for numbers counting up.Sounds · 0.1 KB gzip
- Calm padA warm, quiet pad for calm scenes.Sounds · 0.2 KB gzip
- Space padA soft, airy pad for space scenes.Sounds · 0.2 KB gzip
- Room toneA quiet room tone to fill silence.Sounds · 0.1 KB gzip
- Rain on glassSoft rain on a window pane.Sounds · 0.2 KB gzip
- Soft windA soft wind with gentle gusts.Sounds · 0.2 KB gzip
- Night droneA dark, slow drone with faint insects in the night.Sounds · 0.2 KB gzip
- UnderwaterA muffled underwater drone with a few bubbles.Sounds · 0.2 KB gzip
- Loading pulseA calm, breathing pulse while something loads.Sounds · 0.1 KB gzip
- SyncingA circling shimmer for syncing.Sounds · 0.2 KB gzip
- HeartbeatA slow, deep heartbeat for suspense.Sounds · 0.2 KB gzip
- Trembling airHigh, trembling tones that hang in the air.Sounds · 0.2 KB gzip
- Uneasy droneA low, uneasy drone that beats against itself.Sounds · 0.2 KB gzip
- SlamA tight, punchy hit for hard cuts.Sounds · 0.2 KB gzip
- TimberA dry wooden thud for warm cuts.Sounds · 0.2 KB gzip
- Velvet hitA soft, round hit with a warm low tail.Sounds · 0.2 KB gzip
- AnvilA resonant metal strike with a ringing tail.Sounds · 0.2 KB gzip
- Crystal hitA clear glassy impact with a shimmering tail.Sounds · 0.2 KB gzip
- ThunderA deep cinematic boom with a long rumble.Sounds · 0.2 KB gzip
- Distant boomA far-off boom with a long echo.Sounds · 0.1 KB gzip
- Sub dropA deep sub drop that lands heavy.Sounds · 0.2 KB gzip
- Quick riserA quick, airy swell for fast cuts.Sounds · 0.1 KB gzip
- Cymbal swellA reversed cymbal swell that pulls into the hit.Sounds · 0.2 KB gzip
- InhaleA soft reversed swell that pulls into the cut.Sounds · 0.1 KB gzip
- ExhaleA gentle breath out after the cut.Sounds · 0.1 KB gzip
- Piano stingA minimal piano-like sting for logos.Sounds · 0.2 KB gzip
- Logo revealA soft swell into a warm chord for logo reveals.Sounds · 0.2 KB gzip
- Circuit stingA clean electronic logo sting.Sounds · 0.2 KB gzip
- Tape stopA tape stop that winds the scene down.Sounds · 0.2 KB gzip
- RewindA quick tape rewind for flashbacks.Sounds · 0.2 KB gzip
- WandA quick magical flourish.Sounds · 0.2 KB gzip
- PortalA swirling warp for magical transitions.Sounds · 0.2 KB gzip
- Shimmer riseA bright, glittering rise of high tones.Sounds · 0.2 KB gzip
- TwinklesA few soft twinkles that settle.Sounds · 0.1 KB gzip
- Balloon popA soft balloon pop without the harsh edge.Sounds · 0.1 KB gzip
- Cork popA round cork pop with a little fizz after it.Sounds · 0.2 KB gzip
- Rising bubblesA string of bubbles rising.Sounds · 0.1 KB gzip
- FizzA cluster of tiny bubbles.Sounds · 0.2 KB gzip
- SproutA springy little pop for elements appearing.Sounds · 0.1 KB gzip
- Pop inA soft pop for text popping in.Sounds · 0.1 KB gzip
- VanishA soft airy fade for text disappearing.Sounds · 0.2 KB gzip
- SqueakA soft rubber squeak for cute moments.Sounds · 0.2 KB gzip
- ZapA quick electric zap.Sounds · 0.2 KB gzip
- SparkA tiny electric spark for callouts.Sounds · 0.1 KB gzip
- ScrambleA fast scramble of tones for tech reveals.Sounds · 0.2 KB gzip
- StutterA short digital stutter.Sounds · 0.2 KB gzip
- Data chirpA quick chirp of digital data.Sounds · 0.2 KB gzip
- Pixel blipsTiny eight-bit blips for pixel graphics.Sounds · 0.1 KB gzip
- PunchlineA playful drum sting for comic beats.Sounds · 0.2 KB gzip
- Marker strokeA quick marker stroke for underlines and circles.Sounds · 0.1 KB gzip
No effect matches. Try a shorter word.
Questions
Is it really free?
Yes. Every effect on this site is free, now and later: Pro adds new material on top and takes nothing away. The written license terms are being finished; if you need them before they are published, ask us.
Does it need React?
No. The effects are plain JavaScript and CSS: mark an element with data-motion, or place an <axi0-…> element. React and Vue get thin wrappers typed from the same options.
What happens with reduced motion?
When your system asks for reduced motion, every effect shows its final state and nothing moves. Effects also pause off screen and in hidden tabs, and none of them moves the layout.
How big is it?
The loader is 2.7 KB gzip. A page fetches only the effects it uses, each one checked at build time to stay under 4 KB gzip (a WebGL background under 5 KB, beside the shared runner).
Can I use it on my own site?
Yes, from a copy you host: our CDN answers pages on search.axi0.io today. Get started shows both ways.
What is in Pro?
Premium effects, page blocks, complete templates and an agent kit, from $129 once or $79 a year. Payments open soon; the free library is what exists today. See Pro.