Discover the best marquee websites created by professional designers. Get inspired and start planning your perfect marquee web design today!

NO Javascript, no interactions, just simple, easy-breezy marquees ready to be cloned! The need to create marquees like this for clients has been tremendous recently, so I figured it might be helpful to share with the community!

Note: there will need to be an EVEN number of elements inside your marquees for them to function properly and not skip around. The CSS for each marquee is included inside its container and is denoted with an emoji 👍

Is this cloneable helpful to your workflow? Buy me a coffee! http://buymeacoffee.com/joshwork

CSS Marquees

👍👌 Easy CSS-only Marquees! 👍👌Easy CSS-only Marquees! 👍👌Easy CSS-only Marquees! 👍👌

Free sample of grid based ecomm store. Based on VW units for making it super responsive on larger devices.

Live site: ujjo.com

Ujjo

Ujjo - Ecommerce Site Rebuild

Use multiple words to describe your concept 😃
Here is a handy component to cycle through a list of words!

Includes:
1) An Infinite loop version,
2) A finite version that only runs once.

Both versions are responsive and easy to customize.

Rotating Text

Infinite Text Rotation / Changer (Seamless Loop)

Rebuild of the https://k72.ca/en nav menu

This cloneable is for learning purposes only. I do not own the rights to this design and content.

K72 Menu

Rebuild of https://www.awwwards.com/annual-awards-2021 winners menu.

Menu Hover Effect

Welcome to daily interaction #105!

This demo showcases a recipe card animation on hover. When hovering over the card the image becomes full height, and the card moves forward on the z-axis. The card was placed in a wrapper with a perspective applied to it to bring the card forward. Also a timer icon with the time it takes to create each recipe shows in the upper-right hand corner when hovering. This could be a great recipe card for a food blog.

Happy Webflowing!

Inspired by: https://codepen.io/veronicadev/pen/WJyOwG

To view more daily interactions and premium content visit:
https://www.webdevforyou.com/

If you'd like more information on how this interaction was accomplished be sure to join the Slack Community!

WebDev for You - Daily Interaction #105

WebDev For You - Daily Interaction #105

Live site: twotwo-official.com

Again, Everything is based on VW units such that it looks super responsive on larger devices.

Check another ecomm site based on VW: ujjo.webflow.io

Two Two Official

Two Two Official - eCommerce Site Rebuild

I scoured the internet for the best infinite marquee and I think this one has to be the best. Here's how to build it: https://youtu.be/ZMCNin2VjxU

The Best Infinite Marquee (HTML and CSS only)

The Greatest Infinite Marquee (HTML + CSS only)

Patrick Johnson

 A simple concept site for a coffee roaster and shop built with Client First V2. I implemented native, custom js, and GSAP animations- including an infinite marquee (no skip) attached to the CMS, scroll animations, and a lottie animation during page transitions.

Typeface is Mori by Pangram Pangram®
Images courtesy of Interval MKE & Eka Sutrisno

MONDAYS Coffee

Built with the CMS and a little custom css

Looping Marquee (Pause on Hover)

I wanted to see if I could rebuild this beautiful website. All interactions are created in Webflow :) 

Custom code used to create infinite scroll.

Current limitations (stretch goals to fulfil at a later date):
1) Sound effects
2) Text changing effect

Rebuild of https://one-is.com

One Is [Rebuild]

An interesting 404 error page adds so much personality :) Here is a rebuild of https://www.pluto.app/404 

The stretch goal is to refine the trailing effect by adding rotation.

Trailing 404

404 Page - Sticky Button

To announce the new blending mode and backdrop filter features, Webflow reached out asking me to design and develop three eye-catching builds in two days. I quickly asked two of my friends, Shelby & Corey, for help creating the designs. This is the one concept that was not chosen.

Project Team
Corey, https://dribbble.com/coreyschneiderdesign
Shelby, https://dribbble.com/shelbybuquet
Timothy, https://dribbble.com/tricks

Future Pharmaceutical

This is a hover effect for a portfolio card. When hovered, the card image expands and fades into a video. This has been an effective technique to give a glimpse of each project to the user. An infinite marquee is then overlaid to create a slick effect. 

You can easily modularize this by connecting to your CMS.

Portfolio Hover Effect

Portfolio Reveal Effect

Crossfit Attack Challenge is an event that is the ultimate proving grounds of the fittest athletes on earth. A modern and clean design that features a unique layout and eye-catching animations.

Full cloneable. Enjoy.

Crossfit Attack Classic

I'm a NYC-based freelance web designer, and I just made huge changes to my site to reflect my new skills! My goal was to give it plenty of animation and make it fun to navigate. Enjoy!

alexbeigeweb.dev

Alex Beige Web Designer Portfolio

Alex Beige Portfolio

This infinite marquee displays live crypto token data.

I've used the CoinGecko API for pricing information and reverse-engineered token logos from a popular exchange. You can add further tokens simply by passing them to the fetch URL in my code.

The loop also pauses on hover. Inspired by https://auros.global

Crypto Marquee

Live Crypto Price Ticker

Hi my gorgeous friends of Webflow,

This project contains an infinitely looping marquee with stop on hover.
Just a bit of css needed to build a pretty fancy functionality. :)

But if you feel adventurous, click on the button to activate jQuery super-powers! :)

Enjoy and feel free to leave a comment!

******* PROJECT UPDATE *******
Just added a second page to the project to account for vertical marquee scrolling! :)

Discover marquee websites built by the Webflow community

Discover marquee websites built by the Webflow community