Embla carousel

<br /> <div align="center"> <p align="center"> <a href="https://www.embla-carousel.com/"><img width="110" src="https://www.embla-carousel.com/embla-logo.svg" alt="Embla Carousel"> </a> </p> <p align="center"> <a href="https://opensource.org/licenses/MIT"><img src="https://img.shields.io/npm/l/embla-carousel?color=%238ab4f8"></a> <a href="https://www.npmjs.com/package/embla-carousel"><img src="https://img.shields.io/npm/v/embla-carousel.svg?color=%23c1a8e2"></a> <a href="https://bundlephobia.com/result?p=embla-carousel@latest"><img src="https://img.shields.io/bundlephobia/minzip/embla-carousel?color=%238ab4f8&label=gzip%20size"> </a> </p> <strong> <h2 align="center">Embla Carousel</h2> </strong> <p align="center"> <strong>Embla Carousel</strong> is a lightweight, dependency-free carousel library built for smooth, fluid motion and precision swiping. It’s framework-agnostic, fully open source, and designed to give you complete control without unnecessary bloat. </p> <br> <p align="center"> <strong> <code>&nbsp;<a href="https://www.embla-carousel.com/docs/examples/predefined">Examples</a>&nbsp;</code> </strong> <strong> <code>&nbsp;<a href="https://www.embla-carousel.com/docs/get-started#choose-installation-type">Installation</a>&nbsp;</code> </strong> </p> </div> <br> <div align="center"> <p align="center"> <a href="https://www.embla-carousel.com/docs/get-started/module"> <img src="https://www.embla-carousel.com/javascript-logo.svg" width="40" /> </a> <a href="https://www.embla-carousel.com/docs/get-started/module"> <img src="https://www.embla-carousel.com/typescript-logo.svg" width="40" /> </a> <a href="https://www.embla-carousel.com/docs/get-started/react"> <img src="https://www.embla-carousel.com/react-logo.svg" width="40" /> </a> <a href="https://www.embla-carousel.com/docs/get-started/vue"> <img src="https://www.embla-carousel.com/vue-logo.svg" width="40" /> </a> <a href="https://www.embla-carousel.com/docs/get-started/svelte"> <img src="https://www.embla-carousel.com/svelte-logo.svg" width="40" /> </a> <a href="https://www.embla-carousel.com/docs/get-started/solid"> <img src="https://www.embla-carousel.com/solid-logo.svg" width="40" /> </a> <a href="https://github.com/donaldxdonald/embla-carousel-angular"> <img src="https://www.embla-carousel.com/angular-logo.svg" width="40" /> </a> </p> </div> <br> <div> <p align="center"> <strong>· · ·</strong> </p> </div> <br> <div> <strong> <h2>✨ Sponsors</h2> </strong> <p> Thanks to all the amazing <strong>Embla Carousel</strong> sponsors for making this project possible! <a href="https://github.com/sponsors/davidjerleke">Become a sponsor</a> and help it keep rolling forward. </p> <p> <a href="https://github.com/syntaxfm"> <img src="https://avatars.githubusercontent.com/u/130389858?v=4" title="syntaxfm" width="100" style="max-width: 100%" /> </a><a href="https://github.com/Nalci"> <img src="https://avatars.githubusercontent.com/u/95542245?u=571321b2743c4a54877add003288a7ffb2025751&v=4" title="Nalci" width="100" style="max-width: 100%" /> </a><a href="https://github.com/KaufmannDigital"> <img src="https://avatars.githubusercontent.com/u/25249966?v=4" title="KaufmannDigital" width="100" style="max-width: 100%" /> </a><a href="https://github.com/m0xAy"> <img src="https://avatars.githubusercontent.com/u/126299768?v=4" title="m0xAy" width="100" style="max-width: 100%" /> </a><a href="https://github.com/lenafaure"> <img src="https://avatars.githubusercontent.com/u/7765656?u=108be6daf419844c0605fc806f0c2f65f60cac71&v=4" title="lenafaure" width="100" style="max-width: 100%" /> </a> </p> <p>Thanks to all our <strong>past sponsors</strong> for helping <strong>Embla Carousel</strong> get to where it is today.</p> <p> <a href="https://github.com/gamegatornet"> <img src="https://avatars.githubusercontent.com/u/127601882?v=4" title="gamegatornet" width="50" style="max-width: 100%" /> </a><a href="https://github.com/tolluset"> <img src="https://avatars.githubusercontent.com/u/50096419?u=441ffc617de673faddba523abf7cc4fe0686b1eb&v=4" title="tolluset" width="50" style="max-width: 100%" /> </a><a href="https://github.com/alamenai"> <img src="https://avatars.githubusercontent.com/u/20143684?u=12f7f2c473d63c6862aebfbd3f8d18c3d3d66545&v=4" title="alamenai" width="50" style="max-width: 100%" /> </a><a href="https://github.com/luckasnix"> <img src="https://avatars.githubusercontent.com/u/50385918?u=edb739a97ecf71ef6be8b337e446df5ea7f5d413&v=4" title="luckasnix" width="50" style="max-width: 100%" /> </a><a href="https://github.com/Anrsgrl"> <img src="https://avatars.githubusercontent.com/u/115022999?u=252c1894802fb8eaa9e81314aac0c473474db423&v=4" title="Anrsgrl" width="50" style="max-width: 100%" /> </a><a href="https://github.com/hieptuanle"> <img src="https://avatars.githubusercontent.com/u/3164648?v=4" title="hieptuanle" width="50" style="max-width: 100%" /> </a><a href="https://github.com/simjinseok"> <img src="https://avatars.githubusercontent.com/u/42757954?u=d9478303eefe4f1c44eabc9220e613e73fc9c6c9&v=4" title="simjinseok" width="50" style="max-width: 100%" /> </a><a href="https://github.com/yklmk"> <img src="https://avatars.githubusercontent.com/u/70700647?v=4" title="yklmk" width="50" style="max-width: 100%" /> </a><a href="https://github.com/dmorgorg"> <img src="https://avatars.githubusercontent.com/u/9942570?v=4" title="dmorgorg" width="50" style="max-width: 100%" /> </a><a href="https://github.com/dylancetin"> <img src="https://avatars.githubusercontent.com/u/74064578?u=d54f52377d38fc184553799dce187580a02c1093&v=4" title="dylancetin" width="50" style="max-width: 100%" /> </a><a href="https://github.com/NiuDaLang"> <img src="https://avatars.githubusercontent.com/u/111876003?v=4" title="NiuDaLang" width="50" style="max-width: 100%" /> </a><a href="https://github.com/openscript"> <img src="https://avatars.githubusercontent.com/u/1105080?u=ebda165c92f1f174a7aef1c0defd8a0955b83b01&v=4" title="openscript" width="50" style="max-width: 100%" /> </a> </p> </div> <br> <div> <strong> <h2>🧑‍💻 Contributors</h2> </strong> <p> Thank you to all contributors for making <strong>Embla Carousel</strong> awesome! <a href="https://github.com/davidjerleke/embla-carousel/blob/master/CONTRIBUTING.md">Contributions</a> are welcome. </p> <p> <a href="https://github.com/davidjerleke"> <img src="https://avatars2.githubusercontent.com/u/11529148?s=120&v=4" title="davidjerleke" width="50" style="max-width: 100%" /> </a><a href="https://github.com/Ronit-gurjar"> <img src="https://avatars2.githubusercontent.com/u/92150685?s=120&v=4" title="Ronit-gurjar" width="50" style="max-width: 100%" /> </a><a href="https://github.com/zaaakher"> <img src="https://avatars2.githubusercontent.com/u/46135573?s=120&v=4" title="zaaakher" width="50" style="max-width: 100%" /> </a><a href="https://github.com/xiel"> <img src="https://avatars2.githubusercontent.com/u/615522?s=120&v=4" title="xiel" width="50" style="max-width: 100%" /> </a><a href="https://github.com/javiergonzalezGenially"> <img src="https://avatars2.githubusercontent.com/u/78730098?s=120&v=4" title="javiergonzalezGenially" width="50" style="max-width: 100%" /> </a><a href="https://github.com/meirroth"> <img src="https://avatars2.githubusercontent.com/u/12494197?s=120&v=4" title="meirroth" width="50" style="max-width: 100%" /> </a><a href="https://github.com/hamidrezahanafi"> <img src="https://avatars2.githubusercontent.com/u/91487491?s=120&v=4" title="hamidrezahanafi" width="50" style="max-width: 100%" /> </a><a href="https://github.com/negezor"> <img src="https://avatars2.githubusercontent.com/u/9392723?s=120&v=4" title="negezor" width="50" style="max-width: 100%" /> </a><a href="https://github.com/tetarchus"> <img src="https://avatars2.githubusercontent.com/u/8436118?s=120&v=4" title="tetarchus" width="50" style="max-width: 100%" /> </a><a href="https://github.com/th-km"> <img src="https://avatars2.githubusercontent.com/u/35410212?s=120&v=4" title="th-km" width="50" style="max-width: 100%" /> </a><a href="https://github.com/openscript"> <img src="https://avatars2.githubusercontent.com/u/1105080?s=120&v=4" title="openscript" width="50" style="max-width: 100%" /> </a><a href="https://github.com/nwidynski"> <img src="https://avatars2.githubusercontent.com/u/25958801?s=120&v=4" title="nwidynski" width="50" style="max-width: 100%" /> </a><a href="https://github.com/wopian"> <img src="https://avatars2.githubusercontent.com/u/3440094?s=120&v=4" title="wopian" width="50" style="max-width: 100%" /> </a><a href="https://github.com/SaizFerri"> <img src="https://avatars2.githubusercontent.com/u/19834971?s=120&v=4" title="SaizFerri" width="50" style="max-width: 100%" /> </a><a href="https://github.com/ranno-lauri"> <img src="https://avatars2.githubusercontent.com/u/87007115?s=120&v=4" title="ranno-lauri" width="50" style="max-width: 100%" /> </a><a href="https://github.com/ruijdacd"> <img src="https://avatars2.githubusercontent.com/u/9107610?s=120&v=4" title="ruijdacd" width="50" style="max-width: 100%" /> </a><a href="https://github.com/rojadesign"> <img src="https://avatars2.githubusercontent.com/u/35687281?s=120&v=4" title="rojadesign" width="50" style="max-width: 100%" /> </a><a href="https://github.com/sadeghbarati"> <img src="https://avatars2.githubusercontent.com/u/17789047?s=120&v=4" title="sadeghbarati" width="50" style="max-width: 100%" /> </a><a href="https://github.com/S-Shingler"> <img src="https://avatars2.githubusercontent.com/u/48463809?s=120&v=4" title="S-Shingler" width="50" style="max-width: 100%" /> </a><a href="https://github.com/SeanPlusPlus"> <img src="https://avatars2.githubusercontent.com/u/291079?s=120&v=4" title="SeanPlusPlus" width="50" style="max-width: 100%" /> </a><a href="https://github.com/Yonom"> <img src="https://avatars2.githubusercontent.com/u/1394504?s=120&v=4" title="Yonom" width="50" style="max-width: 100%" /> </a><a href="https://github.com/smultar"> <img src="https://avatars2.githubusercontent.com/u/6223536?s=120&v=4" title="smultar" width="50" style="max-width: 100%" /> </a><a href="https://github.com/soh3illl"> <img src="https://avatars2.githubusercontent.com/u/148645012?s=120&v=4" title="soh3illl" width="50" style="max-width: 100%" /> </a><a href="https://github.com/dev-suraj-kumar"> <img src="https://avatars2.githubusercontent.com/u/184739775?s=120&v=4" title="dev-suraj-kumar" width="50" style="max-width: 100%" /> </a><a href="https://github.com/Matoseb"> <img src="https://avatars2.githubusercontent.com/u/24431250?s=120&v=4" title="Matoseb" width="50" style="max-width: 100%" /> </a><a href="https://github.com/tlo-johnson"> <img src="https://avatars2.githubusercontent.com/u/8763144?s=120&v=4" title="tlo-johnson" width="50" style="max-width: 100%" /> </a><a href="https://github.com/yasuhiro-yamamoto"> <img src="https://avatars2.githubusercontent.com/u/25109330?s=120&v=4" title="yasuhiro-yamamoto" width="50" style="max-width: 100%" /> </a><a href="https://github.com/zackchengyk"> <img src="https://avatars2.githubusercontent.com/u/61947377?s=120&v=4" title="zackchengyk" width="50" style="max-width: 100%" /> </a><a href="https://github.com/anzbert"> <img src="https://avatars2.githubusercontent.com/u/38823700?s=120&v=4" title="anzbert" width="50" style="max-width: 100%" /> </a><a href="https://github.com/ben-basten"> <img src="https://avatars2.githubusercontent.com/u/45583362?s=120&v=4" title="ben-basten" width="50" style="max-width: 100%" /> </a><a href="https://github.com/sarussss"> <img src="https://avatars2.githubusercontent.com/u/15656996?s=120&v=4" title="sarussss" width="50" style="max-width: 100%" /> </a><a href="https://github.com/silllli"> <img src="https://avatars2.githubusercontent.com/u/9334305?s=120&v=4" title="silllli" width="50" style="max-width: 100%" /> </a><a href="https://github.com/yangfancn"> <img src="https://avatars2.githubusercontent.com/u/42950770?s=120&v=4" title="yangfancn" width="50" style="max-width: 100%" /> </a><a href="https://github.com/lesha1201"> <img src="https://avatars2.githubusercontent.com/u/10157660?s=120&v=4" title="lesha1201" width="50" style="max-width: 100%" /> </a><a href="https://github.com/allen-garvey"> <img src="https://avatars2.githubusercontent.com/u/9314727?s=120&v=4" title="allen-garvey" width="50" style="max-width: 100%" /> </a><a href="https://github.com/Ammar-1999"> <img src="https://avatars2.githubusercontent.com/u/96714293?s=120&v=4" title="Ammar-1999" width="50" style="max-width: 100%" /> </a><a href="https://github.com/sedlukha"> <img src="https://avatars2.githubusercontent.com/u/14075940?s=120&v=4" title="sedlukha" width="50" style="max-width: 100%" /> </a><a href="https://github.com/modulareverything"> <img src="https://avatars2.githubusercontent.com/u/8567692?s=120&v=4" title="modulareverything" width="50" style="max-width: 100%" /> </a><a href="https://github.com/cundd"> <img src="https://avatars2.githubusercontent.com/u/743122?s=120&v=4" title="cundd" width="50" style="max-width: 100%" /> </a><a href="https://github.com/dsd"> <img src="https://avatars2.githubusercontent.com/u/81864?s=120&v=4" title="dsd" width="50" style="max-width: 100%" /> </a><a href="https://github.com/fcasibu"> <img src="https://avatars2.githubusercontent.com/u/75290989?s=120&v=4" title="fcasibu" width="50" style="max-width: 100%" /> </a><a href="https://github.com/ishaqibrahimbot"> <img src="https://avatars2.githubusercontent.com/u/74908398?s=120&v=4" title="ishaqibrahimbot" width="50" style="max-width: 100%" /> </a><a href="https://github.com/S1r-Lanzelot"> <img src="https://avatars2.githubusercontent.com/u/4487160?s=120&v=4" title="S1r-Lanzelot" width="50" style="max-width: 100%" /> </a><a href="https://github.com/LiahMartens"> <img src="https://avatars2.githubusercontent.com/u/5265324?s=120&v=4" title="LiahMartens" width="50" style="max-width: 100%" /> </a><a href="https://github.com/LucasMariniFalbo"> <img src="https://avatars2.githubusercontent.com/u/9245477?s=120&v=4" title="LucasMariniFalbo" width="50" style="max-width: 100%" /> </a><a href="https://github.com/junlarsen"> <img src="https://avatars2.githubusercontent.com/u/42585241?s=120&v=4" title="junlarsen" width="50" style="max-width: 100%" /> </a><a href="https://github.com/romellem"> <img src="https://avatars2.githubusercontent.com/u/8504000?s=120&v=4" title="romellem" width="50" style="max-width: 100%" /> </a><a href="https://github.com/Mitch-At-Work"> <img src="https://avatars2.githubusercontent.com/u/99835933?s=120&v=4" title="Mitch-At-Work" width="50" style="max-width: 100%" /> </a><a href="https://github.com/mujahidfa"> <img src="https://avatars2.githubusercontent.com/u/17759705?s=120&v=4" title="mujahidfa" width="50" style="max-width: 100%" /> </a><a href="https://github.com/nikrowell"> <img src="https://avatars2.githubusercontent.com/u/260039?s=120&v=4" title="nikrowell" width="50" style="max-width: 100%" /> </a><a href="https://github.com/horseeyephil"> <img src="https://avatars2.githubusercontent.com/u/32337092?s=120&v=4" title="horseeyephil" width="50" style="max-width: 100%" /> </a><a href="https://github.com/pipisasa"> <img src="https://avatars2.githubusercontent.com/u/54534600?s=120&v=4" title="pipisasa" width="50" style="max-width: 100%" /> </a> </p> </div> <br> <div> <strong> <h2>🌍 Community</h2> </strong> <ul> <li> <strong>Discussions</strong>: Ask questions, share ideas, and start conversations <a href="https://github.com/davidjerleke/embla-carousel/discussions">here</a>. </li> <li> <strong>Issues</strong>: Report bugs or request features <a href="https://github.com/davidjerleke/embla-carousel/issues">here</a>. </li> <li> <strong>Contributing</strong>: See <a href="https://github.com/davidjerleke/embla-carousel/blob/master/CONTRIBUTING.md">CONTRIBUTING.md</a> for how to get involved. </li> </ul> </div> <br> <div> <strong> <h2>🙏 Special Thanks</h2> </strong> <ul> <li> <a href="https://github.com/syntaxfm">syntaxfm</a> - First long-term sponsor with continued support. </li> <li> <a href="https://github.com/gunnarx2">gunnarx2</a> - React wrapper <a href="https://www.embla-carousel.com/docs/get-started/react">useEmblaCarousel</a>. </li> <li> <a href="https://github.com/LiamMartens">LiamMartens</a> - Solid wrapper <a href="https://www.embla-carousel.com/docs/get-started/solid">useEmblaCarousel</a>. </li> <li> <a href="https://github.com/donaldxdonald">donaldxdonald</a>, <a href="https://github.com/zip-fa">zip-fa</a>, <a href="https://github.com/JeanMeche">JeanMeche</a> - Angular wrapper <a href="https://github.com/donaldxdonald/embla-carousel-angular?tab=readme-ov-file#installation">EmblaCarouselDirective</a>. </li> <li> <a href="https://github.com/xiel">xiel</a> - Plugin <a href="https://github.com/xiel/embla-carousel-wheel-gestures">Embla Carousel Wheel Gestures</a>. </li> <li> <a href="https://github.com/zaaakher">zaaakher</a> - Contributing <a href="https://github.com/davidjerleke/embla-carousel/blob/master/CONTRIBUTING.md">guidelines</a>. </li> <li> <a href="https://github.com/sarussss">sarussss</a> - Answering questions. </li> </ul> </div> <br> <h2>🌱 Open Source</h2> <p> Embla is <a href="https://github.com/davidjerleke/embla-carousel/blob/master/LICENSE">MIT licensed</a> 💖.<br><br> ^{Embla Carousel - Copyright © 2019-present.}<br /> ^{Library created by David Jerleke.} </p> <p> <strong>· · ·</strong> </p> <p> Thanks <a href="https://www.browserstack.com">BrowserStack</a>, <a href="https://codesandbox.io/">CodeSandbox</a> and <a href="https://www.algolia.com/">Algolia</a>, for supporting open source tools that help improve projects like Embla Carousel. </p> <p> <a href="https://codesandbox.io/"> <img src="https://www.embla-carousel.com/codesandbox-logo.svg" height="30" /> </a> &nbsp; <a href="https://www.algolia.com/"> <img src="https://www.embla-carousel.com/algolia-logo.svg" height="30" /> </a> &nbsp; <a href="https://www.browserstack.com"> <img src="https://www.embla-carousel.com/browserstack-logo.svg" height="30" /> </a> </p>