# Embla Carousel: A Dependency-Free Carousel for React, Vue, Svelte and Vanilla JS > Embla Carousel is an MIT-licensed TypeScript library that handles carousel motion and swipe physics while leaving markup and styling to you. Here is how it installs, what it does not do, and who should pick it over Swiper. **davidjerleke/embla-carousel** — A lightweight carousel library with fluid motion and great swipe precision. - Repository: https://github.com/davidjerleke/embla-carousel - Website: https://www.embla-carousel.com - Stars: 8,434 · Forks: 262 - Language: TypeScript - License: MIT - Published: 2026-09-22 · Updated: 2026-09-22 · Language: en - Canonical page: https://hysenlabs.com/projects/davidjerleke-embla-carousel ## What Embla Carousel Actually Solves Most carousel libraries ship a slider. Embla Carousel ships the motion underneath one. The README describes it as a lightweight, dependency-free carousel library built for smooth, fluid motion and precision swiping, and the repository topics list touch, touch-events and mobile-web alongside react, vue, svelte and solid. That combination tells you where the project draws its line: it owns pointer and touch handling, slide positioning and snap behaviour, and it deliberately does not own your DOM structure or your visual design. The intended user is a front-end engineer who already has a design system and does not want a carousel's opinion layered on top of it. If your slides are list items with custom classes and your arrows are buttons you styled yourself, Embla expects to be handed those elements and to move them. The library is written in TypeScript and published under MIT, which matters for teams that need to audit or fork what they depend on. The monorepo in package.json also publishes separate packages for React, Solid, Vue and Svelte, so the same engine backs each binding rather than four independent implementations. ## Why the Core Has No Dependencies and What That Costs You The README states the library is dependency-free. In practice that means the carousel does not pull in a gesture library, a utility belt or a framework runtime of its own; the engine is what you install. The upside is predictable bundle behaviour and no transitive upgrade treadmill. The cost is that anything the core does not do has to come from a plugin or from you. The repository layout makes this explicit. Under packages/ there are not only the framework bindings (embla-carousel-react, embla-carousel-vue, embla-carousel-svelte, embla-carousel-solid) but a set of plugins named for the single job each performs: embla-carousel-autoplay, embla-carousel-auto-scroll, embla-carousel-auto-height, embla-carousel-class-names, embla-carousel-fade and embla-carousel-accessibility. There is also embla-carousel-ssr and embla-carousel-reactive-utils. That naming is the architecture: autoplay is not a core option, it is a package you add when you need it. If your requirements are unusual, you are expected to write the plugin, not to file a feature request against the core. ## Installing Embla Carousel and Building a First Slider The README does not inline installation commands; it links to an installation page on the project site with a section titled "Choose installation type", and the repository is published on npm (the README carries an npm version badge for the embla-carousel package). The package names below come from the workspaces list in package.json, so they are the real published names. For a vanilla or TypeScript project, install the core package: ```bash npm install embla-carousel ``` For React, install the binding instead; it depends on the core: ```bash npm install embla-carousel-react ``` The README's own navigation points to a get-started page per framework, for example /docs/get-started/react and /docs/get-started/module, which is where the current initialization example lives. The repository does not reproduce that example in the README, so treat the site documentation as the source of truth for the exact options object rather than copying a snippet from a blog post, since option names have changed across major versions. What the repository does confirm is the set of packages you can add on top. Autoplay, fade, auto-scroll, auto-height, class-names and accessibility are each a separate install from the same monorepo, and the playgrounds directory contains runnable vanilla, React, Solid, Vue and Svelte projects that show the wiring for each binding. If you want to see a working setup before writing your own, those playgrounds are the closest thing to an executable example in the repository. ## The 9.0.0 Release Candidates and What They Mean for Adoption The three most recent releases are v9.0.0-rc01, v9.0.0-rc02 and v9.0.0-rc03, dated 2026-01-20, 2026-04-10 and 2026-08-21 respectively. The monorepo package.json itself carries version 9.0.0-rc03. There is no stable 9.0.0 in the release list. That is the single most important fact for anyone deciding today: the newest line is still labelled a release candidate, and the spacing between the three RCs (roughly three months, then four) suggests a deliberate cadence rather than a rushed one. A release candidate is not a warning label, but it is a signal about where to look for breakage. If you install the latest tag, you are opting into an API that the maintainer has not yet frozen. If you install the last stable major instead, you get a settled API and a migration to plan later. The repository does not document a rollback procedure or a support window for older majors, so the decision is yours to make explicitly rather than by default. One more maintenance note: the last push to the repository was on 2026-09-18, within a week of this writing, and the repository is not archived. That is a fact about activity, not a promise about the next release. ## Where Embla Carousel Is the Wrong Choice Embla is a poor fit when you want the carousel to look finished. There are no themes, no default arrows, no bundled CSS to import and override. If your team's goal is a slider on screen by lunchtime with minimal CSS work, a library that ships its own styling will get you there faster, and fighting Embla's minimalism to recreate that styling is wasted effort. Angular is a specific gap. The README's framework row links Angular to github.com/donaldxdonald/embla-carousel-angular, a separate repository, and the Angular package is absent from the workspaces list in package.json. That does not make Angular unsupported, but it does mean the Angular binding is maintained outside this project's release process, with its own versioning and its own lag behind core releases. Teams that require every dependency to share one release train should treat that as a real constraint. Finally, the plugin split cuts both ways. If your carousel needs behaviour that no existing plugin covers, you are writing and maintaining that plugin yourself, including its interaction with SSR, because embla-carousel-ssr exists precisely because server rendering is not free. A monolithic library would have absorbed some of that work. Embla hands it back to you. ## Embla Carousel vs Swiper: Two Different Centers of Gravity The most common comparison people search for is Embla Carousel against Swiper, and the difference is not quality but scope. Swiper is a full slider product: it brings its own element structure, its own CSS, a large option surface and a long list of built-in effects and modules. You adopt Swiper and then configure it. Embla is the inverse: you build the markup and styles, then hand Embla the container and the slide elements so it can move them, and you add capability through the small single-purpose plugins in this monorepo. That inversion has practical consequences. With Swiper, upgrading the library can change how your slider looks, because the library owns the presentation layer. With Embla, a library upgrade should not touch your CSS at all, because Embla never had any. The trade is that anything Swiper gives you for free (pagination markup, navigation buttons, effect presets) is something you write yourself or install as a separate package. Neither approach is better in the abstract; the question is whether you want a slider product or a motion engine. The same reasoning separates Embla from any carousel that markets its visual effects. If the effect is the product, take the product. If the effect is your design team's job, take the engine. ## Licence, Upgrade Cost and Maintenance Realities Embla Carousel is MIT licensed, both at the repository level and in the monorepo package.json. MIT permits commercial use, modification and redistribution provided the copyright notice and permission notice are retained. That is a permissive arrangement with few obligations, but the licence file itself is the authority, and this is not legal advice; if your organisation has a policy on attribution in shipped bundles, read LICENSE rather than a summary. The upgrade cost is dominated by the plugin split. Because autoplay, fade, auto-scroll and the rest are separate packages with their own versions in the workspaces list, a major core release can require coordinated updates across however many of them you use. The upside is that you only pay that cost for plugins you actually installed. The repository's root scripts include a lint task that runs Prettier and ESLint across workspaces, and a test script that fans out with yarn workspaces foreach, which tells you the maintainer treats the packages as one release unit even though they install separately. There is no documented deprecation policy or long-term support commitment, so plan migrations around release tags rather than around a stated support window. ## Conclusion Adopt Embla Carousel if you control your own markup and CSS and want carousel motion without a styling system attached, and if the framework bindings for React, Vue, Svelte or Solid match your stack. Skip it if you want a prebuilt slider with themes, or if you rely on Angular, where the README points to a separate third-party repository rather than a package in this monorepo. Before committing, check the current release line: the newest published tags are 9.0.0 release candidates, so confirm whether you want a 9.x RC or the latest stable 8.x, and verify on your own browsers that the swipe behaviour you need is covered by the core options and plugins you plan to use. ## FAQ ### How do you install Embla Carousel for React? Install the React binding package, embla-carousel-react, which is listed in the monorepo workspaces alongside the core package. The README links to a React-specific get-started page rather than inlining the setup code. ### What is Embla Carousel? It is a lightweight, dependency-free carousel library written in TypeScript and published under MIT. The README describes it as built for smooth, fluid motion and precision swiping, and it is framework-agnostic with bindings for React, Vue, Svelte and Solid. ### How do you use Embla Carousel? You install the core package or a framework binding, then follow the get-started documentation for that framework, which the README links to. The repository also contains runnable playground projects for vanilla, React, Solid, Vue and Svelte. ### Is Embla Carousel good? That depends on what you want from a carousel. It is a good fit if you already control your markup and CSS and want the motion engine without bundled styling; it is a poor fit if you want a finished-looking slider with themes out of the box, since Embla ships no default presentation layer. ### How does Embla Carousel compare with Swiper? Swiper is a full slider product that brings its own element structure, CSS and built-in effects, while Embla is a motion engine that moves elements you provide and adds capability through small single-purpose plugins such as autoplay, fade and auto-scroll. The practical difference is that a Swiper upgrade can change how your slider looks, while an Embla upgrade should not touch your CSS. ### What is an alternative to Embla Carousel? Swiper is the usual alternative, and it differs in scope rather than quality: it ships its own markup, CSS and built-in effects, so you adopt it and configure it, while Embla moves elements you supply and adds features through separate plugin packages. ## Sources - [davidjerleke/embla-carousel on GitHub](https://github.com/davidjerleke/embla-carousel) - [License: MIT](https://github.com/davidjerleke/embla-carousel/blob/master/LICENSE) - [Project website](https://www.embla-carousel.com) - [README](https://github.com/davidjerleke/embla-carousel/blob/master/README.md) - [Releases](https://github.com/davidjerleke/embla-carousel/releases) --- Hysen Labs editorial analysis, written from the project's own repository and release notes. Cite the canonical page: https://hysenlabs.com/projects/davidjerleke-embla-carousel