30 open-source projects similar to connoratherton/walkway, ranked by shared indexed features. Tags may describe platforms or build tools rather than the same primary purpose. Check each project’s use case, license, and deployment requirements before treating it as a replacement.
This is a React animation library providing a collection of components for creating choreographed motion, complex transitions, and SVG morphing. It functions as a motion design specification and a UI component animation wrapper system used to apply 3D transforms, Bezier curves, and entry-exit transitions to interface elements. The project includes a scroll-driven animation suite for synchronizing UI movements and parallax effects with the viewport position, as well as an SVG motion framework for animating paths, drawing lines incrementally, and interpolating coordinates for shape morphing. I
move.js is a JavaScript motion engine and CSS3 animation framework designed to animate DOM elements. It functions as a DOM animation library that changes visual element properties and colors over time. The library serves as a CSS bezier easing controller, using cubic-bezier curves to manage animation acceleration and deceleration. It enables sequential motion design, allowing multiple visual steps to execute in a specific order. The framework covers the animation of element properties such as position, rotation, scale, skew, and colors. It provides capabilities for UI component transitions a
Hanzi Writer is an interactive Chinese character writing tutor and SVG animation library designed to visualize and validate the sequential construction of characters. It functions as a pedagogical tool for practicing calligraphy by rendering stroke-by-stroke animations and validating user-drawn paths. The library provides a system for comparing user input against predefined stroke sequences to verify writing accuracy in real time. It guides users through interactive exercises, directing the writing process and providing immediate feedback on stroke order. The tool handles the retrieval of ch
canvas-confetti is an HTML5 canvas animation library and browser particle effect engine designed to render celebratory confetti bursts. It functions as a visual effects tool that transforms SVG paths, emojis, and text into animated particles. The library offloads heavy particle calculations to a web worker to maintain main thread responsiveness and prevent the user interface from lagging. It includes built-in support for operating system reduced motion settings, automatically disabling animations for users with motion sensitivities to ensure accessibility compliance. The system supports conf
This project is a declarative motion framework and JavaScript animation engine designed to transition CSS properties, SVG attributes, and DOM elements. It provides a comprehensive set of tools for creating complex, multi-part motion sequences by synchronizing animations, timers, and callbacks into a single, unified timeline. The library distinguishes itself through a robust timeline-based sequence orchestrator that allows for precise timing, label-based control, and hierarchical nesting of animations. It also features a physics-driven interaction library that enables draggable elements with c
Rough Notation is a JavaScript annotation and animation library used to draw sketchy, hand-drawn visual marks over web page elements. It functions as a utility for adding organic-looking underlines, boxes, and highlights to HTML elements to create a hand-drawn aesthetic on digital interfaces. The library provides specialized tools for sequencing drawing animations and managing instructional overlays. It supports the creation of hand-drawn circles, brackets, and highlights that can be triggered in a specific order to guide users through a page. The system handles multiline text annotations by
Motion-vue is a declarative animation library for Vue that provides a framework for building fluid, high-performance user interface motion. It enables developers to define complex animation states and transitions using code-based variants and spring-driven physics, ensuring that visual updates remain synchronized with component lifecycles and application state. The library distinguishes itself through a layout projection engine that tracks element coordinates to animate transitions between layout states, and a gesture-driven input pipeline that maps pointer and scroll interactions to animatio
Motion Canvas is a TypeScript-based framework for creating programmatic animations and motion graphics. It functions as a code-based animation tool that allows developers to define visual transitions, element properties, and timing through scripts rather than traditional timeline-based interfaces. The library renders frame-accurate motion graphics directly in the browser using web technologies. The project utilizes a virtual scene graph to manage visual objects and their transformations, which are then rendered to an HTML5 canvas. It employs generator functions to sequence animations and reac
react-burger-menu is a sidebar navigation component for React applications. It implements an off-canvas menu pattern using CSS transitions and SVG animations to create sliding effects. The component provides configurable transition animations, including slide, stack, and scale effects. It utilizes SVG path morphing to animate the hamburger icon during menu interactions. The library supports menu style customization through configuration objects and external stylesheets. It is designed for responsive web navigation by hiding links behind a toggle button to save screen space.
cursor-effects is a JavaScript library and effect engine designed to implement physics-based cursor trails and floating visual effects in web browsers. It provides a framework for adding interactive graphical overlays that follow the user pointer. The system specializes in spawning particle trails, physics-based floating emojis, and pointer-tracking text strings. These animations utilize spring-based physics simulations to create organic reactions and dispersal patterns as the cursor moves. The library manages the entire lifecycle of visual elements, from coordinate-based pointer tracking an
canvas-nest.js is a JavaScript animation library used to generate interactive particle networks and connected-line visuals for website backdrops. It functions as a programmatic system for rendering a web of intersecting points and lines on an HTML5 Canvas element. The library creates dynamic visual effects where particles move and form connections based on proximity and user interaction. These particle systems respond to mouse movements in real time to produce interactive background rendering. The system includes configuration options to adjust visual styles, such as particle density, line c
ShapeShifter is a visual editor and utility for creating morphing animations between SVG vector paths. It serves as an interpolation editor that allows for the alignment and modification of vector points to produce fluid transitions between different shapes. The project functions as a cross-platform vector asset generator, exporting animation data as spritesheets and drawable files for use on Android, iOS, and web platforms. It specializes in converting disparate SVG path commands into a unified format to ensure a one-to-one point mapping between shapes. The tool includes capabilities for pa
Vanta is a browser-based engine and library for rendering real-time, interactive 3D animations and stylized visual effects. It initializes and manages WebGL graphics within the HTML5 Canvas element to create animated digital art and dynamic backgrounds for web pages. The engine focuses on interactivity, mapping mouse and touch inputs to real-time visual changes. It provides configuration tools to adjust visual parameters, such as colors and animation properties, to align with specific branding and aesthetic requirements. The system handles the full animation lifecycle, including GPU renderin
p5.js is a JavaScript creative coding library and generative art framework. It serves as a web-based graphics engine and a high-level HTML5 Canvas wrapper designed to produce algorithmic imagery and responsive audio-visual experiences. The project provides a simplified sketching API for rendering 2D and 3D graphics directly in a web browser. It enables the creation of interactive animations, generative art, and digital experiences that respond to user input. The library covers a range of applications including interactive data visualization, browser-based multimedia art, and educational prog
Swipe is a JavaScript library for creating touch-based sliders and interactive carousels. It provides a gesture-based navigation tool for building swipeable content interfaces that support touch navigation on mobile and web browsers. The library distinguishes itself through the use of GPU-accelerated transitions and animation frames to ensure smooth motion. It implements a continuous looping effect, allowing content to wrap around seamlessly during navigation. The tool covers the synchronization of slide states with touch inputs and the execution of custom functions when transitions complete
ScrollReveal is a JavaScript library designed to manage scroll-triggered visual transitions for web elements. It functions as a framework for tracking element visibility relative to the browser viewport, allowing developers to apply declarative animation sequences as users scroll through a page. The library provides centralized control over motion design by maintaining a global configuration registry that merges with local element settings to ensure consistent behavior. It distinguishes itself through its lifecycle management capabilities, which include the ability to stagger the reveal of mu
GSAP is a comprehensive JavaScript animation library designed for orchestrating complex motion sequences and interactive user interfaces. It provides a robust property-interpolation engine that calculates intermediate values for CSS styles, attributes, and numeric properties, enabling smooth visual transitions across web elements. The framework is built on a core architecture that manages animation lifecycles, timeline-based sequence orchestration, and virtual property interception to ensure precise control over motion. The library distinguishes itself through a modular, plugin-based extensib
CircleIndicator is a custom Android UI component that functions as a circular page progress indicator. It provides a graphical interface element that represents completion or progress through a circular arc. The component is designed to track a user's position within a sequence of pages, such as during onboarding flow navigation or linear screen transitions. It visualizes progress through a set of screens to provide feedback during mobile app navigation.
This project is a SwiftUI animation library and a collection of reusable motion design patterns for iOS and macOS applications. It provides a gallery of pre-made animated interface elements and physics-based motion effects to create tactile user interface reactions. The library focuses on complex visual sequences, including three-dimensional element rotation, animated path drawing for lines and signatures, and simulated text input effects. It implements fluid layout morphing and seamless content transitions using phase-based timing and shape animations. The framework covers a broad range of
This project is a browser animation library and DOM animation engine that serves as a JavaScript polyfill for the Web Animations API. It provides a programmatic interface for driving visual property changes and transitions of document elements within web browsers. The library enables programmatic UI animation and dynamic document styling using keyframes and precise timing configurations. It supports a unified interface for both standard web elements and vector graphics animation.
huashu-design is a design system infrastructure and a set of specialized design engines for high-fidelity HTML prototyping, quality evaluation, and presentation conversion. It provides tools for generating interactive single-file HTML mockups, frame-based motion design, and a visual evaluator that analyzes design quality across five dimensions using radar charts. The system distinguishes itself through a translation pipeline that converts HTML slide decks into editable PowerPoint and PDF objects rather than flat images. It includes a motion design engine that uses a time-slice model to render
Motion is a physics-based animation engine for building gesturally-driven user interfaces and interactions on Apple platforms. It functions as a Swift frame-by-frame animation utility that drives declarative state changes and simulates physical behaviors. The library executes continuous frame updates by invoking custom value blocks directly from display link timing loops, handling standard numeric and vector types. It supports mid-flight animation interruption, allowing active animations to be stopped, altered, or redirected instantly by mutating live parameters. Additionally, the engine simu
animateplus is a lightweight JavaScript animation library designed for creating high-performance 60 FPS visual transitions and numeric interpolations for website elements. It functions as a promise-based animation engine, using async await patterns to sequence complex motion timelines and timing delays. The library includes a motion blur simulator that applies directional speed blur along the X and Y axes to mimic high velocity. It also provides a numeric interpolation tool to transition colors and graphic properties between states. The system manages high-performance element control, allowi
Animsition is a CSS page transition library and frontend motion framework designed to create fluid visual effects, such as fades and zooms, between web pages. It functions as a DOM navigation animator that manages the timing and sequence of page removal and insertion to provide continuous movement between screens. The system operates as a page overlay animator, utilizing a coordinate-based slide controller to move covering elements across the screen in specific directions. These overlays mask background changes during transitions to maintain visual continuity. The framework leverages hardwar
LogicFlow is an SVG-based flowchart editing framework and visual graph editor used for building customizable business process diagrams. It serves as a customizable diagramming engine for rendering business process models, entity relationship diagrams, and unified modeling language charts. The system is characterized by a plugin-based architecture that allows developers to define specialized graphical elements and register pluggable modules. A distinctive feature is its overlay system, which positions standard HTML components on top of the SVG canvas to create interactive menus and control pan
csshake is a CSS animation library and framework designed to create shaking, vibrating, and oscillating movement effects on DOM elements. It functions as a UI feedback component that uses visual motion patterns to signal errors or draw user attention through irregular element movement. The library provides multi-axis shake effects, including horizontal, vertical, and rotational motion patterns. These are implemented through class-based triggering mechanisms that allow for the delivery of error-signaling patterns and other attention-grabbing effects. The system covers a range of animation con
This project is a collection of experimental frontend prototypes, comprising a creative web layout gallery, a CSS user interface component library, and a visual experiment lab. It serves as an interactive animation showcase for holographic effects, audio-visual synthesis, and dynamic state transitions. The repository features specialized implementations of interactive media, including physics-based particle systems, real-time audio-visual synthesis, and an interactive sketching system. It also includes tools for content generation, such as text-based image reconstruction and a web-based prese
HTextView is an animated text rendering library and UI motion design framework used to create dynamic text effects such as typing and fading. It serves as a text motion engine and typography tool for applying visual transitions and movement to text elements on a screen. The library integrates custom typography support, allowing the loading of external typeface files to apply specific branding and styles to animated presentations. It utilizes a motion engine to animate the scale and opacity of text, facilitating fluid visual transitions. The system manages these effects through a frame-based
Hyperframes is an HTML-to-video rendering engine and composition tool that transforms web layouts and CSS into encoded video files. It functions as a headless browser video pipeline and a distributed video rendering framework, allowing users to create seekable animations and programmatic motion designs using HTML, CSS, and JavaScript. The project differentiates itself as an AI agent video orchestrator, enabling the automation of video scripts and compositions through natural language prompts. It supports distributed video encoding by splitting rendering tasks across multiple serverless functi
ScrollMagic is a DOM scroll interaction framework and animation engine used to map scroll progress to callbacks and visual effects. It functions as a library for triggering animations based on a user's scroll position and the proximity of elements to the viewport. The framework employs a plugin-based system to extend core behavior and customize how elements react during movement. This allows for the development of non-standard scrolling interactions and interactive storytelling experiences where content transitions are tied to the scroll position. The system provides capabilities for viewpor