Projects sharing features with CountUp.js

This project is a Tailwind CSS animation library and accessibility-aware motion framework. It provides a collection of utility classes for adding high-performance keyframe animations and motion effects to web projects, while automatically respecting user-defined reduced motion preferences. The system includes a browser-based animation designer for creating and exporting custom presets as CSS styles or utility classes. It also functions as a scroll-triggered animation framework, enabling entrance and exit transitions that execute as elements enter the viewport, including support for staggered

This repository is a comprehensive collection of functional 2D and 3D demo projects and implementation samples for the Godot Game Engine. It serves as an interactive tutorial and reference library, providing a working codebase to demonstrate how to apply engine features in real-world scenarios. The collection focuses on practical implementation guides, covering a wide array of technical capabilities from basic engine fundamentals to advanced rendering and scripting techniques. It allows users to study the application of node-based composition, asset pipelines, and game logic through direct ex

Odometer is a JavaScript number animation library and frontend UI tool designed to create fluid counting effects. It functions as a numerical transition component that updates numbers on a page using animated rolling or sliding transitions. The library focuses on numerical value animation and data transition effects, allowing users to transition smoothly between two numerical values. This is used for updating metrics and key performance indicators in dynamic dashboard visualizations to avoid abrupt jumps in data displays.

Numeral-js is a JavaScript number formatting library used to convert raw numeric values into human-readable strings for currencies, percentages, and abbreviations. It includes a numeric string parser to extract raw values from formatted strings by removing symbols and delimiters. The library provides locale-aware formatting to adjust decimal separators and currency symbols based on regional language settings. It also features a data size converter that transforms byte values into readable measurements using base-1000 or base-1024 standards. The system supports the registration of custom form

Sal is a lightweight vanilla JavaScript library designed to trigger CSS animations and execute custom logic as elements enter the browser viewport. It serves as a programmatic wrapper for the Intersection Observer API, providing a viewport trigger system to handle visibility thresholds and scroll-based animations. The library operates as a dependency-free frontend tool that manages animations through a class-based trigger mechanism and the injection of CSS custom properties. It includes a system for tracking dynamic content, allowing the observer to be updated to include new elements injected

ScrollReveal is a client-side JavaScript library used to trigger CSS animations and transitions for page elements as they enter the browser viewport. It functions as a DOM element animation trigger and a simplified wrapper for the Intersection Observer API to coordinate visual entrance effects and staggered animations based on the user's scroll position. The library focuses on scroll-driven motion and reveal effects, enabling the execution of visual changes and animations automatically as a user navigates a website. It manages the reveal of page content to create movement and progression with

WOW is a JavaScript library and frontend animation controller that triggers CSS animations when elements enter the browser viewport during scrolling. It functions as a viewport trigger engine, managing the timing and execution of visual transitions for both static and dynamic page content. The library integrates scroll events with CSS animations and effects from libraries such as Animate.css. It utilizes intersection observers to monitor viewport entry and mutation observers to track and apply animation triggers to new elements added to the DOM after the initial setup.

tween.js is a JavaScript animation engine and numeric interpolation library. It is designed to calculate intermediate values between a start and end state over time, using easing functions to create smooth transitions for numeric values and object properties. The project functions as both an animation sequence manager and an easing library, allowing for the coordination of concurrent animation groups and the chaining of multiple transitions. It provides tools for managing the rate of change through acceleration and deceleration functions. The library covers a broad range of motion capabiliti

uillayouts is a comprehensive design system consisting of interactive components, responsive templates, motion-enhanced UI kits, and advanced visual effect toolkits. It provides a collection of accessible React UI components and pre-designed layout sections for landing pages. The project is distinguished by a specialized visual effects library and motion-driven components. It features high-performance graphical enhancements such as glassmorphism, mesh gradients, noise overlays, and SVG masking, alongside interactive elements that utilize physics-based animations and cursor-tracking effects.

This JavaScript smooth scrolling library is a frontend utility and viewport motion controller designed to animate transitions to anchor links. It intercepts standard link clicks to replace instant jumps with fluid movement toward target elements. The library provides configurable motion easing patterns and speed controls to manage acceleration and deceleration. It includes a mechanism to cancel active animations immediately and supports programmatic scroll triggering via direct function calls. The tool handles positioning offsets to prevent target content from being hidden behind fixed heade

AOS is a scroll-triggered animation library that controls the execution, timing, and mapping of CSS transitions based on element visibility and browser viewport intersections. It functions as a DOM element animation controller and a viewport intersection trigger to initiate visual transitions as elements enter the screen. The library utilizes a custom CSS transition bridge to map scroll-based triggers to CSS class changes, enabling integration with external styling frameworks. It supports anchor-based animation triggers, allowing the visibility of one page element to act as the trigger point

Globalize is a JavaScript internationalization library that uses Unicode Common Locale Data Repository JSON data to provide localization services. It functions as a locale-aware string formatter and a system for transforming dates, times, currencies, and numeric values into strings based on specific locale patterns. The library includes a precompiled localization engine that generates optimized formatting functions during the build process. This approach reduces runtime overhead and removes the requirement to load raw locale data at execution. The project covers a broad range of internationa

JazzHands is a UIKit framework providing a scroll-driven animation engine and a paging layout manager. It enables the binding of view properties to timelines of keyframes, allowing visual transitions to be synced with real-time scroll offsets or gesture data. The project distinguishes itself through a value-interpolation engine that calculates intermediate property states. This allows animation progress to be driven by external input values, mapping view attributes to a timeline based on a floating point progress indicator. The framework also includes a system for organizing views within pag

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

Globalize is a JavaScript internationalization library and Unicode CLDR localization engine. It provides a toolkit for formatting dates, numbers, and currencies using the Unicode Common Locale Data Repository and IANA time zones. The project features a build-time localization compiler that precompiles rules into static formatters to reduce runtime overhead and bundle size. It includes a system for parsing and formatting complex strings using the ICU MessageFormat syntax, supporting variables, pluralization, and gender inflections. The library covers a broad surface of localization capabiliti

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

This project is a comprehensive CSS animation tutorial and a structured frontend animation course. It serves as a web motion learning resource designed to teach the implementation of visual transitions and animations within a browser. The resource provides a guide to CSS 3D animation, covering the rendering of three-dimensional scenes and depth. It includes instructions on motion design, ranging from scroll-triggered animations and sprite sheet animation to the creation of complex web interface animations. The material covers core capabilities such as manipulating element geometry, controlli

Skrollr is a dependency-free scroll-driven animation engine and cross-platform frontend library. It functions as a toolkit for linking CSS properties and HTML attributes to scroll positions to create synchronized animations, specifically providing utilities for the interpolation of SVG attributes. The library enables the creation of parallax scrolling and interactive web storytelling by mapping scroll offsets to specific style values. It allows for the development of non-linear movement and dynamic SVG effects through the use of custom HTML attributes that define keyframes. The system covers

Easings.net is a web animation timing tool used for designing, comparing, and exporting cubic-bezier coordinates and timing values. It provides a visual interface for creating easing functions to ensure consistent motion across browsers. The project functions as both an animation motion visualizer and a code generator. It allows for the identification of natural motion profiles through an interactive interface and exports the resulting easing functions as CSS or TypeScript code. The tool covers motion design prototyping and frontend UI animation, focusing on the acceleration and deceleration

This project is a technical guide and implementation library for advanced visual effects and hardware-accelerated animations using the Core Animation framework on iOS. It provides a comprehensive reference for creating high-performance motion graphics, custom graphic rendering, and the construction of 3D engines using perspective transforms and Z-axis manipulation. The collection distinguishes itself through a deep focus on GPU rendering optimization and graphics performance. It covers advanced strategies to maintain high frame rates, such as reducing offscreen rendering via shadow path optim

This is a personal portfolio website that uses scroll position to drive complex SVG scene animations, creating an interactive storytelling experience. The project is built around a scroll-synchronised animation controller that maps user scrolling to a timeline of interpolated state changes across a directed graph of visual elements, enabling fluid scene transitions. The site features a real-time animation state debugger that overlays a live HUD showing timing, active elements, and scene breakdown, with console commands for scene jumping and state export. It also includes a gradient-preserving

Oat is a CSS variable-driven UI kit and semantic HTML component library that styles native HTML elements and attributes contextually, eliminating the need for CSS classes and reducing markup bloat. It provides a complete theming system where all visual properties are defined as CSS custom properties, allowing dark mode toggling and custom color themes by setting a single data attribute on the root element. The library delivers interactive UI elements as zero-dependency WebComponents that require no framework, build tool, or external library, while also offering declarative scroll animations t

FTXUI is a C++ terminal user interface library and cross-platform console framework used for building interactive command line applications. It functions as a declarative terminal layout engine and a component-based UI toolkit that enables the creation of responsive interfaces. The library is distinguished by its terminal graphics and animation capabilities, allowing for the rendering of custom shapes, data plots, and smooth visual transitions using easing functions. It provides a comprehensive set of interactive widgets and a layout system utilizing flexbox and grid containers that adapt to

This project is a plugin for Tailwind CSS that provides a declarative utility library for managing web interface animations. It functions as a motion framework, enabling developers to apply fluid entrance and exit effects to elements directly through utility classes. The framework distinguishes itself by offering a comprehensive suite of motion controls that integrate with the Tailwind ecosystem. It supports granular configuration of animation properties, including timing, duration, delay, and iteration, while allowing for complex transformations like rotation, scaling, and opacity adjustment

next-intl is an internationalization framework for Next.js applications. It provides a system for managing translations, localized routing, and ICU message formatting to deliver multilingual content across server and client components. The project distinguishes itself through a focus on developer experience and type safety, utilizing a TypeScript translation validator that generates declaration files from JSON messages for compile-time key validation. It streamlines translation workflows with tools for automatically extracting strings from source code into message files and synchronizing thos

This project is a terminal graphics library and command-line visual effects tool designed to create dynamic motion graphics using ANSI escape sequences. It provides a framework for implementing an ANSI text animation engine and a motion processor that handles the movement of characters along paths within a shell environment. The tool is distinguished by its wide array of pre-defined visual effects, ranging from simulated environmental phenomena like thunderstorms and fire to high-tech reveals such as laser etching and decryption animations. It also supports extensibility through a plugin-base

maptalks.js is a JavaScript map rendering library and web map interaction framework used to render interactive 2D and 3D geographic data on a web canvas. It functions as a 3D geospatial engine supporting 3DTiles and GLTF formats, a GeoJSON visualization tool, and a spatial analysis library. The project distinguishes itself through high-performance rendering and dynamic geospatial animation, including the ability to simulate traffic flow and execute smooth visual transitions for map elements. It provides comprehensive tools for interactive geometry editing, allowing users to draw and modify ve