React Fast Marquee is a lightweight React component that harnesses the power of CSS animations to create silky smooth marquees.

Check out the demo here and play around with some sample marquees.

If you're using npm, in the command prompt run:

npm install react-fast-marquee --save

If you're using yarn, run:

yarn add react-fast-marquee

To use the component, first import Marquee into your file:

import Marquee from "react-fast-marquee";

Then wrap the <Marquee> tags around any component or text you'd like to slide.

<Marquee>
  I can be a React component, multiple React components, or just some text.
</Marquee>

A sample file might look like this:

import React from "react";
import MyComponent from "../components/MyComponent";
import Marquee from "react-fast-marquee";

const App = () => (
  <Marquee>
    <MyComponent />
    <MyComponent />
    <MyComponent />
  </Marquee>
);

export default App;