Excali Up: Motion effects, GIFs and Iconify for Excalidraw

Animate GIFs and SVG icons, add motion effects, and browse, filter, and favorite Iconify icons inside Excalidraw.

Excali Up brings animated GIF and SVG playback, per-element line and arrow motion, and a complete Iconify-powered icon library directly into Excalidraw. Browse, filter, favorite, and insert icons without leaving the canvas. Code: https://github.com/klysman08/Excaliup Version 4.0.0 Version 4 adds the complete Iconify library with global search, pack/category/tag filters, persistent favorites, the B keyboard shortcut, canvas-ready icon sizing, and a dedicated animated SVG category. GIF and SVG playback can be controlled independently from the extension popup. Features 1. Complete Iconify Library Integration (New in v4.0) Search and browse Iconify's open-source icon sets directly inside Excalidraw via a dedicated, glassmorphic toggle sidebar panel: All available packs: Browse more than 200 collections, including Material, Lucide, Tabler, Phosphor, Font Awesome, logos, emoji, and thematic sets. Library filters: Narrow packs by collection category and tags such as animated, stroke, precise shapes, and padding. Animated SVG category: Browse Iconify's animated collections separately and insert their native SVG animations onto the canvas. Favorite icons: Star frequently used icons and reopen them from the persistent Favorites view. Quick access: Press B outside text fields to open or close the Iconify Library. Pagination system: Renders 96 items per page to prevent browser rendering bottlenecks and keep canvas performance high. Clean SVG click-to-copy: Copying an icon fetches its clean vector SVG directly, automatically converting hardcoded fills to current colors for theme compatibility, and pastes it onto the active canvas. Drag-and-drop support: Drag any icon directly from the sidebar grid and drop it exactly at your cursor position on the Excalidraw canvas. Canvas-ready sizing: Inserted icons use a readable 96px maximum dimension at 100% zoom while preserving their original aspect ratio. Global search: Search across more than 300,000 icons, or search within one selected pack. Dynamic theme matching: The sidebar automatically transitions between light and dark modes to synchronize with Excalidraw's theme state. 2. In-Canvas Tuning Toolbar Select any arrow or line element on the canvas to reveal the Excali Up floating toolbar. Assign, toggle, or tune flow parameters on the fly without leaving your canvas: Opt-in per element: Animations only apply to elements you explicitly choose. Independent tuning: Different lines can have different styles, directions, and speeds simultaneously. Collapsible tuning panel: Click the gear icon to reveal slider and pill controls. 3. Ten Beautiful Motion Styles Particles: Smooth dot flows traveling along paths. Marching Ants: Stylized dashed borders in motion. Gradient Pulse: Premium glowing gradient sweeps that flow like liquid neon energy. Ripple Wave: Concentric expanding ripple rings radiating down the paths. Packet Train: Oriented chevron-shaped data packets flowing in sequence. Snake Trail: Tapered trails that slither and fade along paths. Comet: Bright flowing heads with smooth, fading tails. Electricity: Jagged energy bolts that race along the path. Wave: A traveling sine wave that follows straight and curved elements. Dual Flow: Two offset particle lanes moving in opposite directions. 4. Granular Element Tuning Direction: Forward, Reverse, or Bounce (ping-pong animation). Speed: slow, medium, or fast motion factors. Element Size: Scale range from 1 to 5. Spacing: Gap distance between flow elements from 20px to 120px. Glow Intensity: Bloom levels (None, Subtle, Med, Strong). 5. Real-time GIF and Animated SVG Playback Drag and drop any GIF file to watch it render loops on the board. Insert an animated Iconify SVG and keep its native SMIL or CSS animation playing on the Excalidraw canvas. Enable GIF and animated SVG playback independently from the extension popup dashboard, with GIF speed multipliers of 0.5x, 1x, 1.5x, or 2x.