Overview

vue3-marquee was born from an internal need for a quick and easy marquee component that I wanted to use in our website homepage. Many of the component libraries that I found were either unmaintained, complex or not compatible with Vue 3. This component should also work for you if you would like to use a marquee component that just works out of the box and is customizable to fit your use case.

In my search for a good marquee component, I found a React library that seemed to do what I wanted so I decided to emulate the component in Vue 3 for anyone to use. The original React library can be found here.

With vue3-marquee you have the option of cloning content to remove any empty spaces for marquee elements that don't fit the width of the container. This will allow you to have seamless content that just works.

Installation

Install the vue3-marquee package using your favorite package manager.

yarn
yarn add vue3-marquee@latest
npm
npm install vue3-marquee@latest --save
pnpm
pnpm add vue3-marquee@latest
If you are upgrading from v3 to v4, please remove the dist/style.css import from your project. This css is now imported automatically by the plugin. For more information, see Migrating from v3 to v4.
✨ Well done! Now you can start using vue3-marquee in your application.