React Spotify Text

A small and simple React component inspired by the scrolling text in Spotify

If the text fits within its container, it will not animate. If it overflows it will animate right to left, pausing at the start, with a mask fading out the edges.

(This gif is a really low FPS!)

Note: by default react-spotify-text has no colour/background or font family applied, this is just a demo.

Installation

To install:

npm i react-spotify-text

Usage

The component takes 1 prop: "text" (string)

Most styles applied to a parent element will work and not cause the component to fail.

Usage example:

import { ReactSpotifyText } from "react-spotify-text";

const Example = () => (
  <ReactSpotifyText text="This is a really long title, check it out. Check this out." />
);