Visual editors for the library
Tools
Shape an effect by eye, then take the code. The tools run in this page with the same controls as the effect pages: what you see is what you paste.
Tool 1
Background Studio
Pick a background, tune it live and copy the code. One page switches between every background in place, on a large stage with every option as a control: colors, speed, scale and the rest. The code for HTML, React, Vue and plain JavaScript follows your changes, with a copy button on each.
Pick a background
32 backgrounds today. Each one has its own page with the same controls; the studio switches between them in place.
- 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
- 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
- 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
- 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
- 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 · on click · 0.1 KB gzip
- Tiny tickA tiny, gentle tick for small controls such as icons and chips.Sounds · on click · 0.1 KB gzip
- Metal tapA small, bright metallic tap for links and icon buttons.Sounds · on click · 0.1 KB gzip
- Air tapA breathy, toneless tap for quiet, minimal interfaces.Sounds · on click · 0.1 KB gzip
- Felt pressA muted, padded press for quiet secondary buttons.Sounds · on click · 0.1 KB gzip
- Cushion pressA cushioned press that springs back, for cards and large buttons.Sounds · on click · 0.2 KB gzip
- Glass beadA small glassy ping for picking one item from a set.Sounds · on click · 0.1 KB gzip
- Marble clickA smooth glassy click for carousels and pickers.Sounds · on click · 0.2 KB gzip
- Pure dotA pure, minimal tone for radio buttons and dots.Sounds · on click · 0.1 KB gzip
- Rubber boopA playful, rubbery pop for friendly buttons.Sounds · on click · 0.1 KB gzip
- Mouth popA round mouth pop for playful motion graphics.Sounds · on click · 0.1 KB gzip
- Wood tockA dry little woodblock knock for checking a box.Sounds · on click · 0.1 KB gzip
- String pluckA soft plucked string for picking from a list.Sounds · on click · 0.1 KB gzip
- Step tickA soft plucked tick for each step completed.Sounds · on click · 0.1 KB gzip
- Warm confirmA warm, open fifth for choosing a card.Sounds · on click · 0.1 KB gzip
- Two petalsTwo light notes for picking a swatch or a card.Sounds · on click · 0.1 KB gzip
- Switch clickA soft two-step click that turns a switch on, and its mirror that turns it off.Sounds · on click · 0.2 KB gzip
- Rocker switchA sturdy two-part click for big switches, lower on the way off.Sounds · on click · 0.2 KB gzip
- Spring toggleA playful springy wobble for fun toggles, bending up for on and down for off.Sounds · on click · 0.2 KB gzip
- Detent notchA soft detent for steppers, sliders and tabs.Sounds · on input · 0.1 KB gzip
- Tuned stepA tiny tuned detent for volume and value steps.Sounds · on input · 0.1 KB gzip
- Tab flickA crisp little flick for switching tabs.Sounds · on click · 0.1 KB gzip
- Tab glideA smooth, rounded slide for moving between tabs.Sounds · on click · 0.1 KB gzip
- SealA soft, settled click for saving and locking.Sounds · on click · 0.1 KB gzip
- UnlockA soft click that opens into air, for unlocking.Sounds · on click · 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 · on click · 0.2 KB gzip
- Light and darkA bright little rise for switching to light mode and a soft settle for dark.Sounds · on click · 0.2 KB gzip
- Expand and collapseA soft flutter that opens a section, and the matching one that tucks it away.Sounds · on click · 0.2 KB gzip
- Power on, power offA rising glow for powering on or connecting, and a falling fade for powering off.Sounds · on click · 0.2 KB gzip
- Menu liftA tiny lift for opening menus and popovers.Sounds · on click · 0.1 KB gzip
- Grid snapA quick pull and a crisp snap onto a grid or a slot.Sounds · on click · 0.2 KB gzip
- Record start and stopA clear double beep when recording starts and a falling pair when it stops.Sounds · on click · 0.2 KB gzip
- Play and pauseA quick spin up for starting playback and a soft spin down for pausing.Sounds · on click · 0.2 KB gzip
- BloomTwo warm notes that rise into a quiet success.Sounds · on click · 0.1 KB gzip
- CrestA brighter four-note lift for bigger wins.Sounds · on click · 0.2 KB gzip
- SettleA single warm note that quietly says done.Sounds · on click · 0.1 KB gzip
- SummitA quick climbing run that opens into a chord when everything is complete.Sounds · on click · 0.2 KB gzip
- CoinA bright two-note coin for rewards and points.Sounds · on click · 0.1 KB gzip
- SparkleA quick sparkle for small wins.Sounds · on click · 0.2 KB gzip
- Heart pulseA warm double pulse for likes and favorites.Sounds · on click · 0.2 KB gzip
- Reaction popA bright little pop for adding a reaction.Sounds · on click · 0.1 KB gzip
- Level upA rising power-up for leveling up.Sounds · on click · 0.2 KB gzip
- Wooden runA quick wooden run for keeping a streak alive.Sounds · on click · 0.1 KB gzip
- TreasureA warm thump that opens into a shimmering chord.Sounds · on click · 0.2 KB gzip
- ConfettiA soft pop and a shower of sparkles for celebrations.Sounds · on click · 0.2 KB gzip
- AcceptA smooth rising tick for accepting a suggestion.Sounds · on click · 0.2 KB gzip
- SendA quick airy lift for sending a message.Sounds · on click · 0.2 KB gzip
- Read receiptTwo tiny ticks for delivered and read.Sounds · on click · 0.2 KB gzip
- Upload doneA rising breath and a bright ping when an upload finishes.Sounds · on click · 0.2 KB gzip
- Download doneA falling breath that lands softly when a download finishes.Sounds · on click · 0.2 KB gzip
- ShakeA quick, muted shake for input that does not fit.Sounds · on click · 0.2 KB gzip
- Not quiteA gentle falling pair that says not quite.Sounds · on click · 0.1 KB gzip
- CrunchA crunchy digital hit for errors in tech scenes.Sounds · on click · 0.2 KB gzip
- BlockedA low, firm double buzz for an action that is blocked.Sounds · on click · 0.1 KB gzip
- Low powerA dim, flickering tone for low battery and fading power.Sounds · on click · 0.2 KB gzip
- Alert pulseA clear repeating pulse for time-sensitive alerts.Sounds · on click · 0.1 KB gzip
- NudgeA soft double tap that asks for attention.Sounds · on click · 0.1 KB gzip
- Spring backA springy return when a drag is canceled.Sounds · on click · 0.1 KB gzip
- UndoA soft little rewind for undo and revert.Sounds · on click · 0.2 KB gzip
- Three bellsThree soft bells for a new notification.Sounds · on click · 0.2 KB gzip
- Clear pingOne clear bell with a quiet tail.Sounds · on click · 0.1 KB gzip
- DingA clean bell ding for highlights.Sounds · on click · 0.1 KB gzip
- Chat bubbleTwo round notes for a message in an open chat.Sounds · on click · 0.1 KB gzip
- IncomingTwo round blips for an incoming message.Sounds · on click · 0.1 KB gzip
- MentionA clear rising pair for when someone mentions you.Sounds · on click · 0.2 KB gzip
- KalimbaA plucked kalimba pair for friendly notifications.Sounds · on click · 0.2 KB gzip
- Wooden reminderA mellow wooden pair for calm reminders.Sounds · on click · 0.2 KB gzip
- HintA neutral, airy tone for tips and info.Sounds · on click · 0.1 KB gzip
- Coming upA gentle three-note rise for upcoming events.Sounds · on click · 0.1 KB gzip
- Someone joinedA soft vibraphone two-tone for someone joining.Sounds · on click · 0.2 KB gzip
- Join callA warm rising chord for joining a call.Sounds · on click · 0.2 KB gzip
- Typing dotsThree faint dots for someone typing.Sounds · on click · 0.1 KB gzip
- CountdownThree beeps and a go, for starts and launches.Sounds · on click · 0.2 KB gzip
- Clock tickA dry clock tick for countdowns and timers.Sounds · on click · 0.1 KB gzip
- FocusA small focus whir and two confirm beeps for emphasis.Sounds · on click · 0.2 KB gzip
- ShutterA soft mechanical shutter for photos and screenshots.Sounds · on click · 0.2 KB gzip
- SwishA short, airy swipe for sliding panels.Sounds · on click · 0.1 KB gzip
- Sheet openA soft rise for opening a sheet or a modal.Sounds · on click · 0.2 KB gzip
- Sheet closeA falling breath for closing and dismissing.Sounds · on click · 0.2 KB gzip
- DrawerA sliding glide that lands with a soft stop.Sounds · on click · 0.2 KB gzip
- Flick awayA very short flick for swiping something away.Sounds · on click · 0.1 KB gzip
- Page turnA soft paper turn for pages and steps.Sounds · on click · 0.2 KB gzip
- ShuffleA light double slide for reordering items.Sounds · on click · 0.1 KB gzip
- Fly byA light, quick pass from one side to the other.Sounds · on click · 0.2 KB gzip
- GustA full, soft whoosh that passes from left to right.Sounds · on click · 0.2 KB gzip
- GaleA heavy, wide whoosh with low weight under it.Sounds · on click · 0.2 KB gzip
- SwoopA fast, deep swoop with a tonal edge.Sounds · on click · 0.2 KB gzip
- SpinA whirling whoosh that circles around.Sounds · on click · 0.1 KB gzip
- SilkA smooth, silky swish like fabric.Sounds · on click · 0.2 KB gzip
- WhipA sharp, quick whip for snappy cuts.Sounds · on click · 0.2 KB gzip
- Twin passTwo quick passes, one after the other.Sounds · on click · 0.1 KB gzip
- DriftA slow, airy pass with a gentle tail.Sounds · on click · 0.1 KB gzip
- Tonal wipeA clean tonal sweep for wipes and slides.Sounds · on click · 0.1 KB gzip
- Zoom inA punchy zoom-in with a tonal rise and a landing.Sounds · on click · 0.2 KB gzip
- Step forwardA light step up for next and forward.Sounds · on click · 0.1 KB gzip
- Step backA light step down for back and previous.Sounds · on click · 0.1 KB gzip
- Dive inA quick dip for drilling into a folder.Sounds · on click · 0.2 KB gzip
- Pick upA soft lift as an item is picked up.Sounds · on press · 0.2 KB gzip
- Put downA gentle landing as an item is put down.Sounds · on click · 0.1 KB gzip
- StackA soft cascade as items stack together.Sounds · on click · 0.2 KB gzip
- BannerA clean sweep and a click for lower thirds and banners.Sounds · on click · 0.2 KB gzip
- Title slideA short tonal slide that lands, for titles moving in.Sounds · on click · 0.1 KB gzip
- Ready glowA faint glow when a drop target is ready or a pointer arrives.Sounds · on hover · 0.1 KB gzip
- Laptop keysLaptop key presses with a slightly different take on every keystroke.Sounds · on key · 0.2 KB gzip
- Deep keysDeeper key presses with a rounded, muted body.Sounds · on key · 0.2 KB gzip
- Low keysLight, low-profile key taps like a thin modern keyboard.Sounds · on key · 0.2 KB gzip
- Typewriter keysCrisp mechanical key clicks for type-on titles.Sounds · on key · 0.2 KB gzip
- Enter keyA key press that lands with a soft confirm, for Enter and submit.Sounds · on click · 0.2 KB gzip
- Erase keyA softer key with a little sweep, for delete and backspace.Sounds · on click · 0.2 KB gzip
- TickerRapid soft ticks for text that appears letter by letter.Sounds · on click · 0.2 KB gzip
- Counting ticksFast rising ticks for numbers counting up.Sounds · on click · 0.1 KB gzip
- Calm padA warm, quiet pad for calm scenes.Sounds · on click · 0.2 KB gzip
- Space padA soft, airy pad for space scenes.Sounds · on click · 0.2 KB gzip
- Room toneA quiet room tone to fill silence.Sounds · on click · 0.1 KB gzip
- Rain on glassSoft rain on a window pane.Sounds · on click · 0.2 KB gzip
- Soft windA soft wind with gentle gusts.Sounds · on click · 0.2 KB gzip
- Night droneA dark, slow drone with faint insects in the night.Sounds · on click · 0.2 KB gzip
- UnderwaterA muffled underwater drone with a few bubbles.Sounds · on click · 0.2 KB gzip
- Loading pulseA calm, breathing pulse while something loads.Sounds · on click · 0.1 KB gzip
- SyncingA circling shimmer for syncing.Sounds · on click · 0.2 KB gzip
- HeartbeatA slow, deep heartbeat for suspense.Sounds · on click · 0.2 KB gzip
- Trembling airHigh, trembling tones that hang in the air.Sounds · on click · 0.2 KB gzip
- Uneasy droneA low, uneasy drone that beats against itself.Sounds · on click · 0.2 KB gzip
- SlamA tight, punchy hit for hard cuts.Sounds · on click · 0.2 KB gzip
- TimberA dry wooden thud for warm cuts.Sounds · on click · 0.2 KB gzip
- Velvet hitA soft, round hit with a warm low tail.Sounds · on click · 0.2 KB gzip
- AnvilA resonant metal strike with a ringing tail.Sounds · on click · 0.2 KB gzip
- Crystal hitA clear glassy impact with a shimmering tail.Sounds · on click · 0.2 KB gzip
- ThunderA deep cinematic boom with a long rumble.Sounds · on click · 0.2 KB gzip
- Distant boomA far-off boom with a long echo.Sounds · on click · 0.1 KB gzip
- Sub dropA deep sub drop that lands heavy.Sounds · on click · 0.2 KB gzip
- Quick riserA quick, airy swell for fast cuts.Sounds · on click · 0.1 KB gzip
- Cymbal swellA reversed cymbal swell that pulls into the hit.Sounds · on click · 0.2 KB gzip
- InhaleA soft reversed swell that pulls into the cut.Sounds · on click · 0.1 KB gzip
- ExhaleA gentle breath out after the cut.Sounds · on click · 0.1 KB gzip
- Piano stingA minimal piano-like sting for logos.Sounds · on click · 0.2 KB gzip
- Logo revealA soft swell into a warm chord for logo reveals.Sounds · on click · 0.2 KB gzip
- Circuit stingA clean electronic logo sting.Sounds · on click · 0.2 KB gzip
- Tape stopA tape stop that winds the scene down.Sounds · on click · 0.2 KB gzip
- RewindA quick tape rewind for flashbacks.Sounds · on click · 0.2 KB gzip
- WandA quick magical flourish.Sounds · on click · 0.2 KB gzip
- PortalA swirling warp for magical transitions.Sounds · on click · 0.2 KB gzip
- Shimmer riseA bright, glittering rise of high tones.Sounds · on click · 0.2 KB gzip
- TwinklesA few soft twinkles that settle.Sounds · on click · 0.1 KB gzip
- Balloon popA soft balloon pop without the harsh edge.Sounds · on click · 0.1 KB gzip
- Cork popA round cork pop with a little fizz after it.Sounds · on click · 0.2 KB gzip
- Rising bubblesA string of bubbles rising.Sounds · on click · 0.1 KB gzip
- FizzA cluster of tiny bubbles.Sounds · on click · 0.2 KB gzip
- SproutA springy little pop for elements appearing.Sounds · on click · 0.1 KB gzip
- Pop inA soft pop for text popping in.Sounds · on click · 0.1 KB gzip
- VanishA soft airy fade for text disappearing.Sounds · on click · 0.2 KB gzip
- SqueakA soft rubber squeak for cute moments.Sounds · on click · 0.2 KB gzip
- ZapA quick electric zap.Sounds · on click · 0.2 KB gzip
- SparkA tiny electric spark for callouts.Sounds · on click · 0.1 KB gzip
- ScrambleA fast scramble of tones for tech reveals.Sounds · on click · 0.2 KB gzip
- StutterA short digital stutter.Sounds · on click · 0.2 KB gzip
- Data chirpA quick chirp of digital data.Sounds · on click · 0.2 KB gzip
- Pixel blipsTiny eight-bit blips for pixel graphics.Sounds · on click · 0.1 KB gzip
- PunchlineA playful drum sting for comic beats.Sounds · on click · 0.2 KB gzip
- Marker strokeA quick marker stroke for underlines and circles.Sounds · on click · 0.1 KB gzip
More tools
What is live, and what is not built yet, so you know where the tools are going.
Hero builder
A background, a headline effect and a button on one stage, exported as a single HTML file.
PlannedEvery interface sound on one page with a play button, to audition and copy as a
Livedata-soundline.