Top 10 Angular Carousel Components of 2024 [Updated]

Here’s a list containing what we think are the best Angular Carousels. If you are looking for a carousel, we have you covered!

1. fullPage.js

fullPage.js for Angular is clearly the best full-screen carousel. With more than 8 years on its back and 34K+ stars on GitHub, fullPage.js component is the leader of its kind. (Used by BBC, Dreamworks and many other big companies.)

Fully configurable with 50+ options and plenty of callbacks and methods that will provide you with a smooth developing experience. Both vertical and horizontal scrolling are supported.

What makes fullPage.js stand out compared to other carousels, is that it creates an inmersive full-screen experience. Scrolling up or down will snap to the next section making it easy and quite pleasant for the visitor to navigate.

It’s ideal for storytelling, marketing, and websites with beautiful visual elements.

2. Angular Slick – ui-carousel

Slick is a popular jQuery and WordPress plugin and, thanks to a third person, it has now been ported to Angular.

It’s a simple component to create a basic carousel. If you are looking for a more traditional kind of carousel, Slick can be for you.

It also includes a fading effect and some fancy features such as carousels syncing.

One of the main disadvantages that I see is that it still requires jQuery as a dependency.

3. Keen Slider

Keep Slider was born in 2020 as an agnostic touch slider without dependencies and with hooks for React and Composition functions for Vue 3.

It can however be still used directly in Angular and in fact all its examples ara available for Angular as well.

4. Swiper

Developed by Vladimir Kharlampidi, Swiper is a well-known carousel. And it’s for a good reason.

Swiper comes with quite a big amount of configurable options. This might be a bit overwhelming for some, but if you like to have total control over your carousel, this one might be for you.

It also comes with advanced features such as multi-row slides layouts, virtual slides or two-way control.

5. Angular Owl Carousel

An Angular wrapper for Owl Carousel.

It might feel a bit more obsolete to some, as it still relies in the good old jQuery library. But if that’s not a problem for you, Owl carousel is a totally valid solution.

It comes with all the basics you would expect: responsive options, URL hashing, autoplay, lazy load and dragging support.

6. Angular Gallery (ngx-angular)

If you want to create a gallery with images and their thumbnails, ngx-angular might be for you.

Related article: what is a slider?.

This Angular carousel has been designed with a single purpose in mind: being an image gallery. Thus, it has a few advantages such as covering very specific problems and making it easier to use to build galleries.

The documentation is on Github but you can find plenty of examples on its website as well.

7. IvyCarousel – Angular Responsive Carousel

As the name of the npm component indicates (angular-responsive-carousel), this component puts special focus on making it easy to create responsive carousels.

If you need a responsive carousel, this one might be perfect for you. On top of that, it also provides the expected features such as lazy loading, touch support, free scroll, autoplay, bullet navigation, arrows etc.

I would say it’s a more simple component than others, but a perfectly working solution for many scenarios.

8. Angular Flickity

An angular module around Flickity. Flickity is a JavaScript component developed by Desandro and now brought to Angular by a third person.

Flickity is a quality component although perhaps a little short in responsive options. Also, not being the official wrapper, you might find that updates and support might be a bit slower.

Flickty documentation is amazing, so you’ll for sure like that part! Oh, and it comes with a full-screen feature too, which comes no handy for image galleries.

9. ngx-gallery – Angular Gallery

Very similar to npx-angular, this carousel is an alternative option if you plan to create a gallery of images.

Unlike other carousels, ngx-gallery supports a full-screen visualization of images. And, although it supports the usual sliding to switch between images, it also supports fading, rotating and zooming animations.

I doesn’t seem to support dragging with mouse devices and the touch support is much more basic than in other carousels.

10. Ngu-carousel

Advertised as the “Angular Universal Carousel” this carousel tries to keep things as simple and as agnostic as possible.

It doesn’t include any CSS so you will be the one having to deal with all the styling. This will for sure be a turn down for many, but probably a liberation for others, it all depends on what kind of problem you are trying to solve.

It relies in hammer.js dependency for touch support.

Related Articles

• Best Practises for Carousels UI
• Best jQuery Carousels
• Best React Carousels