awesome-repositories.com
Blog
MCP
awesome-repositories.com

Discover the best open-source repositories with AI-powered search.

ExploreCurated searchesOpen-source alternativesSelf-hosted softwareBlogSitemap
ProjectMCP serverAboutHow we rankPress
LegalPrivacyTerms
© 2026 Bringes Technology SRL·VAT RO45896025·hello@awesome-repositories.com
·
FormidableLabs avatar

FormidableLabs/react-animationsArchived

0
View on GitHub↗
3,044 stars·154 forks·JavaScript·MIT·12 views

React Animations

React animations is a CSS keyframe animation library and inline style animation tool designed for React applications. It supplies pre-built keyframe motion sequences that can be applied directly to inline styles and component layouts without requiring external CSS stylesheet files.

The library functions by defining reusable animation keyframes as plain immutable JavaScript objects, eliminating the need for imperative animation controllers. It dynamically generates standard CSS keyframe rules at runtime from these declarative JavaScript objects and injects them into the document on the fly, attaching compiled animation identifiers directly to component style objects.

Additional capabilities include combining distinct motion sequences into a single unified animation that executes multiple transform sets simultaneously, as well as merging separate keyframe transformation sets without causing style conflicts.

Features

  • Animation Style Presets - Supplies pre-built keyframe motion sequences applied directly to inline component styles.
  • Composite Animation Sequences - Merges multiple distinct motion sequences into a single unified animation executing transform sets simultaneously.
  • Inline Styles - Applies pre-built keyframe transitions directly inside component style objects.
  • CSS Animations - Generates standard CSS keyframe rules dynamically at runtime from declarative JavaScript animation objects.
  • Component Motion Effects - Adds smooth motion and transition effects to user interface elements using JavaScript style objects in React.
  • Keyframe Injection - Generates standard CSS keyframe definitions programmatically for use in component styles.
  • Inline Style Bindings - Attaches compiled animation identifiers directly to component style objects for inline rendering.
  • Keyframe Animation Systems - Defines reusable animation keyframes as plain immutable JavaScript objects instead of controllers.
  • CSS Injection Mechanisms - Programmatically injects generated CSS keyframe rules into the document dynamically on the fly.

Star history

Star history chart for formidablelabs/react-animationsStar history chart for formidablelabs/react-animations

AI search

Explore more awesome repositories

Describe what you need in plain English — the AI ranks thousands of curated open-source projects by relevance.

Start searching with AI

Open-source alternatives to React Animations

Similar open-source projects, ranked by how many features they share with React Animations.
  • tictail/bounce.jstictail avatar

    tictail/bounce.js

    6,165View on GitHub↗

    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

    CSS
    View on GitHub↗6,165
  • formidablelabs/radiumFormidableLabs avatar

    FormidableLabs/radium

    7,346View on GitHub↗

    Radium is a CSS-in-JS styling library that transforms static inline styles into dynamic, responsive, and animated CSS for React components. It functions as a component style toolchain and React inline style enhancer, allowing developers to define styles using plain JavaScript objects while gaining capabilities like browser state handling, vendor prefixing, and style composition. The library extends React's inline style system by automatically resolving browser state styles for hover, focus, and active interactions without manual event handlers. It supports inline media queries that evaluate a

    JavaScript
    View on GitHub↗7,346
  • beekai-oss/react-simple-animatebeekai-oss avatar

    beekai-oss/react-simple-animate

    1,820View on GitHub↗

    React-simple-animate is a declarative motion framework designed for building CSS keyframe animations and style transitions within web interfaces. It functions as a utility for orchestrating complex, multi-step visual effects by defining style sequences, timing, and easing properties directly within component logic. The library distinguishes itself through its focus on sequencing and coordination, allowing developers to chain multiple animation instances or group them to execute in specific orders. By utilizing functional hooks and declarative properties, it manages animation lifecycles and st

    TypeScriptanimateanimate-cssanimation
    View on GitHub↗1,820
  • css-doodle/css-doodlecss-doodle avatar

    css-doodle/css-doodle

    6,018View on GitHub↗

    css-doodle is a web component for creative coding that renders live CSS-generated patterns and animations directly in the browser. It creates generative art and visual patterns by applying CSS rules to a grid of cells, using the browser's native layout engine for positioning and styling. The component encapsulates its pattern canvas and styling within a custom element's shadow DOM, isolating it from page styles and enabling reusable instances. The tool distinguishes itself by driving pattern configuration through CSS custom properties, allowing dynamic style changes and real-time updates with

    JavaScript
    View on GitHub↗6,018
See all 30 alternatives to React Animations→

Frequently asked questions

What does formidablelabs/react-animations do?

React animations is a CSS keyframe animation library and inline style animation tool designed for React applications. It supplies pre-built keyframe motion sequences that can be applied directly to inline styles and component layouts without requiring external CSS stylesheet files.

What are the main features of formidablelabs/react-animations?

The main features of formidablelabs/react-animations are: Animation Style Presets, Composite Animation Sequences, Inline Styles, CSS Animations, Component Motion Effects, Keyframe Injection, Inline Style Bindings, Keyframe Animation Systems.

What are some open-source alternatives to formidablelabs/react-animations?

Open-source alternatives to formidablelabs/react-animations include: tictail/bounce.js — bounce.js is a JavaScript library and programmatic wrapper for generating and applying CSS3 keyframe animations and 3D… formidablelabs/radium — Radium is a CSS-in-JS styling library that transforms static inline styles into dynamic, responsive, and animated CSS… marcosgriselli/viewanimator — ViewAnimator is a Swift animation library and view transition framework designed to coordinate visual motion effects… css-doodle/css-doodle — css-doodle is a web component for creative coding that renders live CSS-generated patterns and animations directly in… beekai-oss/react-simple-animate — React-simple-animate is a declarative motion framework designed for building CSS keyframe animations and style… hepengwei/visualization-collection — This project is a frontend visualization library and gallery of interactive web examples. It provides a collection of…

Curated searches featuring React Animations

Hand-picked collections where React Animations appears.
  • a library of animated icons for web
  • React Animation Libraries
  • React animation component library