18 CSS Carousels

May 31, 2017

Collection of free HTML and CSS carousels: horizontal and vertical. Demo and download code (*zip).

Table Of Contents

  1. Horizontal Carousels
  2. Vertical Carousels

Horizontal Carousels

Demo Image: Carousel
Demo Image: Carousel

Carousel

Carousel with React.js.
Made by Andy Pagès
February 16, 2017

Demo Image: 3D Smooth Carousel
Demo Image: 3D Smooth Carousel

3D Smooth Carousel

3D smooth carousel/slider with HTML, CSS and JavaScript.
Made by Eduardo Allegrini
February 4, 2017

Demo Image: Infinite Automatic Carousel
Demo Image: Infinite Automatic Carousel

Infinite Automatic Carousel

HTML, CSS and JavaScript infinite automatic carousel.
Made by Julien Lejeune
January 31, 2017

Demo Image: Hover-Carousel
Demo Image: Hover-Carousel

Hover-Carousel

Moves left or right in relation to the mouse position inside it’s area.
Made by Yair Even Or
January 4, 2017

Demo Image: HTML, CSS and JavaScript Carousel
Demo Image: HTML, CSS and JavaScript Carousel

HTML, CSS and JavaScript Carousel

A simple carousel.
Made by DobladoV
November 23, 2016

Demo Image: Mobile Carousel
Demo Image: Mobile Carousel

Mobile Carousel

HTML and CSS material cards carousel.
Made by Kate Hummer
October 21, 2016

Demo Image: Looping Instagram Feed Carousel
Demo Image: Looping Instagram Feed Carousel

Looping Instagram Feed Carousel

Latest posts from Instagram pulled into a slick.js carousel.
Made by Ryan Mulligan
August 8, 2016

Demo Image: Simple Synchronised Carousel
Demo Image: Simple Synchronised Carousel

Simple Synchronised Carousel

This is the simple synchronised carousel used awesome Slick.js carousel.
Made by Rian Ariona
July 25, 2016

Demo Image: Horizontal 3D Carousels
Demo Image: Horizontal 3D Carousels

Horizontal 3D Carousels

HTML and CSS horizontal carousels. Just hover the boxes.
Made by Daniel Racine
August 10, 2015

Demo Image: CSS Carousel
Demo Image: CSS Carousel

CSS Carousel

HTML and CSS 3D transform colorful animated carousel.
Made by Edmundo Santos
August 1, 2015

Demo Image: Ambilight Carousel
Demo Image: Ambilight Carousel

Ambilight Carousel

Bootstrap carousel with ambilight.
Made by adobewordpress
May 13, 2015

Demo Image: Carousel Team
Demo Image: Carousel Team

Carousel Team

Concept carousel with some basic functions such as auto play.
Made by Marco Barría
January 27, 2015

Demo Image: 3D Carousel
Demo Image: 3D Carousel

3D Carousel

3D Carousel with Waterwheel-carousel.js
Made by Juan C. Irizar
December 3, 2014

Demo Image: 3D Cube Carousel
Demo Image: 3D Cube Carousel

3D Cube Carousel

4-sided carousel/slider in 3D.
Made by Derek Wheelden
February 5, 2014

Demo Image: CSS Carousel With Keyboard Controls
Demo Image: CSS Carousel With Keyboard Controls

CSS Carousel With Keyboard Controls

Not recommended for production use. But it seemed like a fun idea to see how far I could take a form with radio inputs.
Made by David Lewis
June 29, 2014

Vertical Carousels

Demo Image: Pure CSS Carousel
Demo Image: Pure CSS Carousel

Pure CSS Carousel

Basic carousel made with radio’s.
Made by Olivier PASCAL
March 24, 2017

Demo Image: React Vertical Carousel
Demo Image: React Vertical Carousel

React Vertical Carousel

Background Image, panel background colour and panel content all change with the carousel. Uses CSS transitions to fade between slides.
Made by Alex Boffey
February 12, 2017

Demo Image: Split 3D Carousel
Demo Image: Split 3D Carousel

Split 3D Carousel

A new spin on the carousel pattern with a split panel transition in three dimensions.
Made by Paul Noble
December 10, 2016

FreeFrontend © 2016 - 2017

Back to top