# Effects gallery Optional effects for native presentations. Choose an effect, install its pack, and try a complete MDX example. Source: https://legend.so/slides/effects/ Legend Slides: Preview. Effects download separately from Legend Slides. Related effects share small versioned packs; a deck includes only the effects it imports. See [Installing effects](https://legend.so/slides/effects/installation/) to use a pack in a deck, or [Publishing effect packs](https://legend.so/slides/effects/publishing/) to add effects and maintain the gallery. 33 effects [![Animated title in Legend Slides](https://legend.so/slides/effects/previews/animated-title/804a8930c1de64f3cc5e884850e4445c563af9c5991e02c63b6e503ed879b351.png) ## Animated title Sixteen entrances for words, letters and whole headings. ](https://legend.so/slides/effects/animated-title/)[![Ambient aurora in Legend Slides](https://legend.so/slides/effects/previews/ambientaurora/03bde1c22588785b73a05985499f473f13ed34ece15e37622d7f47720d50d58a.png) ## Ambient aurora Soft animated ribbons of color. ](https://legend.so/slides/effects/ambientaurora/)[![Droplets in Legend Slides](https://legend.so/slides/effects/previews/droplets/cc9e020742d2babc11f29dafa115182ccc9246a98acbc6774102ed0a7a36eaa6.png) ## Droplets A liquid droplet field with smooth unions. ](https://legend.so/slides/effects/droplets/)[![Fluid in Legend Slides](https://legend.so/slides/effects/previews/fluid/d663f46a694261a8f70c9ef54e4590e5ae053a8254202ec41649a69c61ce5506.png) ## Fluid Flowing color and light. ](https://legend.so/slides/effects/fluid/)[![Smoke in Legend Slides](https://legend.so/slides/effects/previews/smoke/c58dcb728a2507ec0f9f1faf70759e4a27ab836a072a221421150b03ee1e6e6d.png) ## Smoke Drifting layered smoke. ](https://legend.so/slides/effects/smoke/)[![Wireframe in Legend Slides](https://legend.so/slides/effects/previews/wireframe/7bf1d01e9167f1e5ab8ddc08b77ce05285d9f46044f0522eed23f621f282f3b7.png) ## Wireframe An animated geometric wireframe. ](https://legend.so/slides/effects/wireframe/)[![Glass atmosphere in Legend Slides](https://legend.so/slides/effects/previews/glassatmosphere/08859dc8f3bae69b59c09635d657847dfc21faf811e132312fe54aed894adaea.png) ## Glass atmosphere Ambient refracted glass forms. ](https://legend.so/slides/effects/glassatmosphere/)[![Interactive glass in Legend Slides](https://legend.so/slides/effects/previews/interactive-glass/13daa8a36deae8aa583790928507c04ed7600055535e350e3cb5fba3a2261981.png) ## Interactive glass A WebGPU glass atmosphere. ](https://legend.so/slides/effects/interactive-glass/)[![Glass panels in Legend Slides](https://legend.so/slides/effects/previews/glass-panels/9d52a16e3b654a2ed5d44bcb900985ade0d734eedc896292c9c6c36eae098fce.png) ## Glass panels Rounded panels rendered together on one glass surface. ](https://legend.so/slides/effects/glass-panels/)[![Glass strike in Legend Slides](https://legend.so/slides/effects/previews/glass-strike/f0cd62883ef9e917859962eefdbaad639886d13aba7422daaa31bdba4a9f0ad9.png) ## Glass strike Strike a glass panel, shatter it and optionally resolve to a check. ](https://legend.so/slides/effects/glass-strike/)[![Upward flames in Legend Slides](https://legend.so/slides/effects/previews/upward-flames/30d01266fdef24dea85df9afd39a8ad9d1edc99c680d1671e11b5b22b416693a.png) ## Upward flames Fire grows upward from a bar using the shared step clock. ](https://legend.so/slides/effects/upward-flames/)[![Falling sprites in Legend Slides](https://legend.so/slides/effects/previews/falling-sprites/980d47afd350b5bb99819fffd0e1452bfd0f74ace6c9b243dc0aeb26fcf2b79e.png) ## Falling sprites Images fall through fire, splash and accumulate on the stage floor. ](https://legend.so/slides/effects/falling-sprites/)[![Image shatter in Legend Slides](https://legend.so/slides/effects/previews/image-shatter/5dc42b11d21b9e2c285f2ac6a99b642b54bea09205acefcc38fdf73f931d6b1e.png) ## Image shatter Reveal an image, then break it into falling pieces. ](https://legend.so/slides/effects/image-shatter/)[![Prismatic tear in Legend Slides](https://legend.so/slides/effects/previews/prismatic-tear/90e68d2e476ed434d02fe0b44a370f7bfe0f182c7822614e584f1d119e9aa626.png) ## Prismatic tear Timed image distortion over captured slide content. ](https://legend.so/slides/effects/prismatic-tear/)[![Soft ripple in Legend Slides](https://legend.so/slides/effects/previews/soft-ripple/b86fbadfd97b03cde1ea521814929f7f4f15ef2ec4c515f84671a9cb96edbfe8.png) ## Soft ripple Timed image distortion over captured slide content. ](https://legend.so/slides/effects/soft-ripple/)[![Refraction in Legend Slides](https://legend.so/slides/effects/previews/refraction/b68ffed936d0cde73a8bbde4a551c7a89ad31b2369bce44c548d5cdb5b09b494.png) ## Refraction Rounded glass regions refract and blur their captured content. ](https://legend.so/slides/effects/refraction/)[![Glow field in Legend Slides](https://legend.so/slides/effects/previews/glow-field/7055f3538c4fbb4254e7b2cec4af95bad39ba8954cd2f6bdeb99b69d334dca99.png) ## Glow field A configurable particle program executed by the host WebGPU renderer. ](https://legend.so/slides/effects/glow-field/)[![Window storm in Legend Slides](https://legend.so/slides/effects/previews/window-storm/d80bba3c64b19eabe679146c23dc935b0a96659b78488b839eebf8203632ec56.png) ## Window storm A configurable particle program executed by the host WebGPU renderer. ](https://legend.so/slides/effects/window-storm/)[![Constellation in Legend Slides](https://legend.so/slides/effects/previews/constellation/729ab603c534b41d6fba7fdf799721f056090620af445022c8a8f7f1086536e7.png) ## Constellation A configurable particle program executed by the host WebGPU renderer. ](https://legend.so/slides/effects/constellation/)[![Interface reveal in Legend Slides](https://legend.so/slides/effects/previews/interface-reveal/bd7610f915c0d6c4a0c4c8aee897defb3e0459365581c1851be11da51353bf07.png) ## Interface reveal A configurable particle program executed by the host WebGPU renderer. ](https://legend.so/slides/effects/interface-reveal/)[![Trajectory emitter in Legend Slides](https://legend.so/slides/effects/previews/trajectory-emitter/d41e01b3fdd1e1f110a2527dbfea156775b0629ea5520124d6cfc8429eb2ce86.png) ## Trajectory emitter Repeat arbitrary content along native keyframe paths. ](https://legend.so/slides/effects/trajectory-emitter/)[![Branch fan in Legend Slides](https://legend.so/slides/effects/previews/branch-fan/1f78e5bbba098e86ed6bc3eea2076139debd88a4a72d15e0f73e5368b0c6b557.png) ## Branch fan Curved, illuminated ribbons connect a root to caller-defined endpoints. ](https://legend.so/slides/effects/branch-fan/)[![Progressive detail in Legend Slides](https://legend.so/slides/effects/previews/progressive-detail/888992768ba8a89717fccfae799502c5a8eccf3babe05f2dd568138932e4042b.png) ## Progressive detail Reveal and compare caller-supplied content while keeping its state mounted. ](https://legend.so/slides/effects/progressive-detail/)[![Comparison wipe in Legend Slides](https://legend.so/slides/effects/previews/comparison-wipe/1acacada557b3f49bf9e1f4ae2235197e149ed018c40a44e9b78012cbb4aaae0.png) ## Comparison wipe Reveal and compare caller-supplied content while keeping its state mounted. ](https://legend.so/slides/effects/comparison-wipe/)[![Content swap in Legend Slides](https://legend.so/slides/effects/previews/content-swap/a4668fbfb63dbb36ea851d273ef1f22ac649ead47bfb53278a61112fe4fb74af.png) ## Content swap Reveal and compare caller-supplied content while keeping its state mounted. ](https://legend.so/slides/effects/content-swap/)[![Exploded layers in Legend Slides](https://legend.so/slides/effects/previews/exploded-layers/bc470f69f68d1aa590b78fe85fd6f87f4219d42ade9f3490e7a3316713b60060.png) ## Exploded layers Reveal and compare caller-supplied content while keeping its state mounted. ](https://legend.so/slides/effects/exploded-layers/)[![Spotlight and callouts in Legend Slides](https://legend.so/slides/effects/previews/spotlight/14de924545f82e168573391172156829080e11ffc17d3aa08c307f5578e3b2cc.png) ## Spotlight and callouts Measured attention overlays follow targets through stage scaling. ](https://legend.so/slides/effects/spotlight/)[![Code walkthrough in Legend Slides](https://legend.so/slides/effects/previews/code-walkthrough/237f961ade4242bb4ee322c6138544a8cc099e2909078140510b9ad92954fc6b.png) ## Code walkthrough Emphasize and scroll to selected lines of source. ](https://legend.so/slides/effects/code-walkthrough/)[![Freeze and annotate in Legend Slides](https://legend.so/slides/effects/previews/freeze-frame/7dfc21d8344fb240e6ffa97886be6b5f7f5ebfbfef9b8838345fad355b519418.png) ## Freeze and annotate Pause a controlled animation and show annotations without remounting it. ](https://legend.so/slides/effects/freeze-frame/)[![Chart bar in Legend Slides](https://legend.so/slides/effects/previews/chart-bar/5aee19146f08fe754d71abec5db7069224fbc586626e4bed0ad5340525491b85.png) ## Chart bar A textured animated bar with optional grouping colors. ](https://legend.so/slides/effects/chart-bar/)[![Animated chart row in Legend Slides](https://legend.so/slides/effects/previews/bar-row/2c5b171a79ed2430561f76a2b14f6a23138bbca92d0341ac9f70f0abb152b29a.png) ## Animated chart row Stable labels and changing values move with an animated chart bar. ](https://legend.so/slides/effects/bar-row/)[![Media carousel in Legend Slides](https://legend.so/slides/effects/previews/app-carousel/38e37f9377f59c9bcbac02a6276a2846652578cd57a69609626d2046537dfe27.png) ## Media carousel A configurable filmstrip with focus blur and retained content. ](https://legend.so/slides/effects/app-carousel/)[![Lottie animation in Legend Slides](https://legend.so/slides/effects/previews/lottie-player/f684369e6cbbe3686473dbdc4c489fdca7f35ec770b75dac4c0453972404bf79.png) ## Lottie animation Native Lottie playback synchronized with the shared slide clock. ](https://legend.so/slides/effects/lottie-player/) [View Markdown](https://legend.so/slides/effects.md)[Report a documentation correction](https://github.com/LegendApp/legend-docs/issues/new?title=Docs%3A+Effects+gallery&body=Page%3A+https%3A%2F%2Flegend.so%2Fslides%2Feffects%0A%0AWhat+is+incorrect+or+missing%3F%0A%0AExpected+behavior+or+supporting+source%3A%0A)