Open-source alternatives to Csshake

Animate.css is a CSS animation library and browser-based motion framework. It provides a collection of pre-made animations and motion effects used to add visual movement to web elements across different browsers. The library is designed as an accessibility-aware system that automatically disables animations when the operating system has a reduce motion setting enabled. This ensures that web motion respects user preferences for accessibility. The framework covers front-end visual effects and cross-browser UI styling. It utilizes a utility-first architecture with predefined style classes to ma

Animate.css is a library of pre-defined, cross-browser CSS keyframe animations that can be applied to elements through declarative class toggling. It functions as a comprehensive motion framework, providing a standardized set of effects that ensure consistent visual transitions without requiring custom keyframe definitions. The library is built with a focus on accessibility, automatically respecting system-level reduced motion preferences to ensure that animations are disabled or simplified for users sensitive to screen movement. The framework distinguishes itself through a modular build proc

Short CSS code snippets for all your development needs

svg-spinners is a collection of animated vector loading indicators. It serves as an SVG spinner library that provides a set of reusable graphics used to signal background processes or page loads. The project consists of a CSS animation library and a SMIL animation collection. It utilizes both CSS-driven keyframe animations and the Synchronized Multimedia Integration Language to create rotating and pulsing visuals. These assets are designed for frontend integration to provide user interface feedback. The library employs SVG-native shape rendering and fixed-dimension viewport scaling to ensure

This project is a collection of lightweight animated loading indicators and pure CSS UI components. It provides a library of pre-made styles and keyframes for rendering visual motion effects and loading spinners without the use of JavaScript. The library prioritizes minimal document object model overhead by utilizing a single-element HTML structure for each loader. It employs pseudo-elements to create complex shapes and relies on font-size based scaling to ensure proportional resizing across different dimensions. These components function as user interface feedback systems, providing visual

bounce.js is a JavaScript library and programmatic wrapper for generating and applying CSS3 keyframe animations and 3D transformations. It provides a tool for creating complex animation sequences without the need to write manual stylesheet rules. The library allows for the creation of animations by chaining scale, rotation, translation, and skew transformations. These generated sequences can be saved under unique names for reuse across multiple elements. The system manages the animation lifecycle through callback functions that trigger when a visual sequence completes. It also includes a com

SpinKit is a UI component library and CSS animation library focused on providing a collection of animated loading indicators and spinners. It serves as a set of lightweight visual transitions designed to create motion and feedback within web interfaces. The library implements these indicators using pure CSS rendering and keyframe animations to notify users of active background processes. It uses a class-based styling system and minimal HTML structures to render visual cues without relying on scripts or images. Appearance can be adjusted through CSS variables and custom styles to modify color

Animate Components is a motion framework that provides a collection of declarative primitives for managing visual transitions and animation sequences within web applications. It functions as a component-based library designed to standardize motion behavior, ensuring that interface elements move and transition consistently across different parts of a project. The library distinguishes itself through a framework-neutral architecture that bridges animation logic with various component models. By utilizing a declarative interface, it allows developers to compose complex motion patterns and synchr

Velocity is a JavaScript animation library used to create high-performance CSS and SVG animations. It functions as a CSS property interpolator and a spring physics engine, enabling the creation of smooth visual transitions and organic movement for web elements. The project provides a programmatic interface for modifying vector attributes and 3D transformations through its SVG animation framework. It further distinguishes itself as an animation sequence orchestrator, allowing for the chaining of movements and the staggering of start times across multiple elements using promises. The library c

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 library provides a collection of component-based wrappers designed to automate element entrance animations within web interfaces. By utilizing the browser's intersection observer capabilities, it tracks element visibility to trigger visual transitions automatically as content enters the viewport. The library distinguishes itself through declarative orchestration, allowing for the creation of sequential and staggered reveal patterns across groups of elements. It manages the animation lifecycle by dynamically injecting CSS keyframes into the document, ensuring that motion effects are appli

Hover is a collection of pre-defined CSS3 animations and reusable stylesheets for links, buttons, and images. It serves as a web UI animation kit and a library of styles written in CSS, Sass, and LESS to provide visual feedback when a user hovers over an element. The library includes specialized interactive effects that simulate tactile behaviors, such as page curls and the rendering of speech bubbles. It also provides a set of animation primitives to manipulate backgrounds, borders, shadows, and glow effects to simulate depth and elevation. The project covers a wide range of element motion

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

Transition.css is a CSS animation library and declarative UI animation framework that provides pre-built entry and exit animations triggered directly by HTML attributes without requiring custom JavaScript. It functions as a CSS transition toolkit, supplying customizable animation sequences and geometry primitives designed for rapid web interface prototyping. The library enables users to apply page and element transitions, trigger pre-built visual effects, and compose custom transitions by combining raw keyframes with custom state properties. Animation timing, delays, pacing curves, and transi

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

WOW is a JavaScript library and animation engine designed to trigger CSS animations when elements enter the browser viewport during page scrolling. It serves as a tool for orchestrating visual transitions based on the user's scroll position and element visibility. The library functions as a dynamic content animation tool, capable of detecting and animating new elements added to the page after the initial load. This allows visual effects to be applied to dynamically injected content without requiring a page refresh. The system utilizes the Intersection Observer API to detect viewport entry an

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

AndroidViewAnimations is an animation library and visual effects toolkit for Android applications. It provides a framework for implementing motion effects, such as bouncing, sliding, and rotating transitions, for views within Android layouts. The library features a collection of predefined motion presets and stylized transition effects. These include curated sequences for shaking and pulsing to guide user attention, as well as complex movements like hinging or rolling for interface entry and exit. The toolkit covers a wide range of visual effects, including linear slides, elastic bounces, tr

spin.js is a CSS loading spinner library used to signal background processes through resolution-independent activity indicators. It provides a JavaScript animation wrapper that manages the lifecycle and document injection of these elements, allowing for the programmatic start and stop of loading states. The project allows for the definition of spinner geometry, colors, and animation speed to match specific design systems. Users can customize the visual appearance through parameters such as line count, radius, and shadow effects, while also controlling rotation direction and timing. The libra

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

React Parallax is a React animation component library that creates multi-speed scrolling background depth effects. It computes relative scroll positions within viewports to translate raw page offsets into normalized animation progress values, applying hardware-accelerated translation and scaling styles to DOM nodes for smooth visual movement. The library supports rendering background images and arbitrary visual elements that shift positions at different speeds relative to foreground content. It provides dynamic Gaussian blur filter transitions that interpolate based on current scroll velocity

Tailwind Animations is a plugin-based toolkit that provides a collection of reusable CSS animation styles and utility classes for web interfaces. It enables the application of motion effects directly within existing styling workflows, allowing developers to implement transitions, fades, and slides without writing custom keyframe definitions. The library utilizes a declarative configuration approach, mapping simple class modifiers to underlying animation properties. By leveraging native CSS capabilities, it performs style orchestration without requiring JavaScript execution at runtime. The sys

This project is a React-based administrative template and UI kit designed for building dashboards. It provides a comprehensive collection of pre-styled layouts, an accessible component library, and a Sass-based UI framework for creating administrative interfaces. The template is specifically structured as an AI-optimized project, utilizing coding patterns and organization designed to help AI assistants generate consistent, production-ready React code. It features a flexible styling system using Sass variables and CSS custom properties to support customizable light and dark themes. The kit co

Walkway is a web animation framework and library designed for creating and managing drawing animations on SVG paths, lines, and polylines. It functions as a utility for executing geometric line animations within a browser, providing a system to control the playback state and timing of vector graphics. The library allows for the configuration of custom durations and easing functions to control the visual flow of drawings. It manages animation states through a system that can trigger sequences via callbacks and pause progress when the browser window loses focus. The framework covers high-level

eva-icons is a comprehensive cross-platform UI icon pack providing over 480 scalable vector graphics and font-based icons. It functions as both an SVG icon library and a web font icon set designed for consistent use across web, iOS, and Android interfaces. The collection is an animated icon set that supports motion effects such as zooming, pulsing, shaking, and flipping to provide visual feedback or draw user attention. The library covers the implementation of SVG graphics and web font iconography, enabling the injection of visual elements via JavaScript or CSS stylesheets. It supports multi

ViewAnimator is a Swift animation library and view transition framework designed to coordinate visual motion effects across interface elements. It provides a motion engine that executes animation sequences and geometric transforms on individual views and layout cells. The framework is built around a standardized animation protocol, allowing developers to create and integrate custom movement and transition behaviors. This extensibility enables the creation of reusable animation libraries beyond the pre-defined effects. The system supports combining multiple visual transforms into single compo

Tippy.js is a JavaScript tooltip library and interactive popup framework used to create tooltips, popovers, and dropdowns. It functions as a floating UI component toolkit that renders content relative to a reference element with support for automatic positioning, flip-positioning, and offsets. The library acts as an accessible overlay manager, using ARIA attributes and focus management to ensure screen reader compatibility. It also serves as a CSS animation tool, providing utilities for transitions, spring physics, and themes to manage the visual entry and exit of floating interface elements.