--- title: "react-slick alternatives in 2026" description: "Migrating off react-slick: Embla and Swiper for real carousels, react-horizontal-scrolling-menu for centerMode-as-navigation rows. Honest migration guide." canonical: "https://react-horizontal-scrolling-menu.dev/compare/react-slick-alternatives" image: "https://react-horizontal-scrolling-menu.dev/og.png" --- [Compare](https://react-horizontal-scrolling-menu.dev/compare.md)/react-slick alternatives # react-slick alternatives: migrate by what you built with it react-slick ports the jQuery-era slick carousel to React. It still works, but the architecture predates hooks, releases are sparse, and it drags a separate CSS file into every build. The right replacement depends less on features than on which of two camps your usage falls into. | | react-slick | Embla | Swiper | react-horizontal-scrolling-menu | | --- | --- | --- | --- | --- | | What it is | React port of jQuery slick | Headless carousel engine | Full slider framework | Scrolling menu, native scroll | | Maintenance | Sparse | Active | Active | Active since 2018 | | Bundle (min+gzip) | ≈15 kB + slick CSS | ≈8 kB | ≈40 kB | ≈5.7 kB | | Extra CSS file required | Yes (two) | No | Yes (core) | One, or Tailwind via shadcn item | | Slide semantics (snap, dots, fade) | Yes | Yes | Yes | No — deliberately | | Rows of clickable items | Bent via centerMode | Hand-built on the engine | Configured against the grain | The core use case | Sizes are approximate cores. The last column is this site’s own library — the table says so rather than pretending otherwise. ## Camp one: it was a real carousel Hero sliders, image galleries, testimonial rotators — anything where slick's dots, fade and autoplay carried the design. Migrate to a real carousel engine: - **[Embla](https://react-horizontal-scrolling-menu.dev/compare/embla-vs-swiper.md)** if you style everything yourself and want a small headless core — the closest to "slick, modernized" in spirit. - **Swiper** if you used slick's feature list heavily; every slick feature has a Swiper equivalent, usually better. Map `slidesToShow`/`slidesToScroll` to Embla's `slidesInView`/`slidesToScroll` or Swiper's `slidesPerView`/`slidesPerGroup`, and expect to delete your arrow-positioning CSS overrides — both successors let you render your own buttons. ## Camp two: it was navigation wearing centerMode The other slick install is the quiet one: a row of categories, logos, dates or filters, bent into a carousel with `centerMode`, `focusOnSelect` and `variableWidth` because slick was already in the bundle. The tell is what you fought: clicks firing after drags, arrows at the wrong times, items you couldn't measure, snap you didn't want. That row was a menu. [react-horizontal-scrolling-menu](https://react-horizontal-scrolling-menu.dev/index.md) does the three things centerMode was faking — [center the clicked item](https://react-horizontal-scrolling-menu.dev/examples/center-on-click.md), scroll natively with [drag support](https://react-horizontal-scrolling-menu.dev/examples/mouse-drag.md), and report [which items are visible](https://react-horizontal-scrolling-menu.dev/examples/simple.md) — in ≈5.7 kB with no slider engine. See the [scrollable tabs](https://react-horizontal-scrolling-menu.dev/scrollable-tabs.md) and [category rail](https://react-horizontal-scrolling-menu.dev/category-rail.md) pages for the two most common shapes. ## Whichever camp: the migration is smaller than it looks slick’s API surface is large, but audits of real configs shrink fast: most projects use a handful of props. List the ones you actually set, decide which camp each usage is in, and migrate per-instance — the two camps often coexist in one codebase, and there is no rule both must land on the same library. [Compare](https://react-horizontal-scrolling-menu.dev/compare.md) · [Browse all examples](https://react-horizontal-scrolling-menu.dev/examples.md) · [GitHub](https://github.com/asmyshlyaev177/react-horizontal-scrolling-menu) --- More examples: Library summary for LLMs: