We searched the web for the best JS plugins and libraries all web developers should know about, and came up with this awesome roundup of 40 most useful JS plugins for your inspiration!
Add these gems to your toolbox! We categorized them, for easy browsing, into JS plugins for audio, buttons and switches, carousel sliders, data visualization, file upload, forms and search, images, layout, maps, modals, navigation, notifications, transition and effects and typography.
Huge thanks to the creators of these amazing JS plugins!
This is a jQuery plugin that replaces the
<audio> element with a custom HTML code. You can also get a whole new player which looks the way you want, with just a bit of CSS.
Buttons & Switches
These are some subtle effects and styles for simple dot navigation with you. These can be used for a page scroll navigation or a thumbnail preview.
This is a fast, beautiful, and painless social share plugin. Check it out!
This is a simple, responsive and fast plugin. This touch-friendly jQuery carousel slider is minimalist and offers everything you need from a simple slider plugin.
This slider plays with 3D perspective and performs some interesting animations on the right-hand side images.
Unslider is an ultra-simple jQuery slider for your website. To get started using Unslider, just download the repos.
This is a collection of tools that will make your life easier creating meaningful and beautiful data visualizations.
This is a HTML5+JSON interactive table plugin. Dynatable is a semantic, interactive table plugin using jQuery, HTML5, and JSON.
DropzoneJS is an open source library that provides drag and drop file uploads with image previews. It’s lightweight too!
Forms & Search
This plugin lets you filter & sort magical layouts. You can also use Isotope to develop commercial sites, themes, projects, and applications, if using the Commercial license.
This is a jQuery plugin that gives users real time hints & progress updates as they complete forms.
This is a jQuery plugin for extracting dominant colors from images and applying it to its parent.
croppic is supported on current browsers, such as chrome, Firefox, IE, safari and opera. This is an image cropping jquery plugin that will satisfy your needs and much more.
This is a jQuery/Zepto Face Detection plugin that works on images and videos.
This is a plugin which lets you create a 3D interactive object using images and one simple JS call.
Fit.js helps you fit things into other things. The concept is best illustrated on the demo page.
MixItUp is a jQuery plugin providing animated filtering and sorting.
It is great for managing any categorized or ordered content like portfolios, galleries and blogs.
This is a jQuery plugin that creates an image slider which gives more information when clicked on. It has included a bunch of built-in animations for the modal windows.
Magnific Popup is a responsive lightbox & dialog script with a focus on performance and providing the best experience for users.
This is a lightbox only for images, not videos, text, and iframes. It is perfect for those who want a purpose-focused, lightweight plugin.
This is a tutorial on how to re-create the slide out sidebar menu that can be seen on the Google Nexus 7 website.
This is a tutorial that will teach you how to replicate the behavior of the side menu, similar to what you’ve seen on smartphone applications.
This is a simple parallax plugin. For the best experience, check out this site on a mobile or tablet equipped with a gyroscope.
This is a plugin for creating beautiful full screen scrolling websites. With fullPage.js you will be able to add horizontal sliders in the most simple way ever.
Midnight.js lets you switch fixed headers on the fly, create your fixed nav (or header) and also you can use whatever markup suits you.
Transitions & Effects
AnimateScroll is a jQuery plugin which enables you to scroll to any part of the page in style.
This is a collection of libraries with useful open-sourced tools for you to use, improve and share.
OriDomi features a built-in queuing system that can be used to easily create sequences. It also has the ability to manipulate a composition with the mouse or by touch is enabled by default.
FitText makes font-sizes flexible. Use this plugin on your fluid or responsive layout to achieve scalable headlines that fill the width of a parent element.
FlowType.JS changes the font-size and subsequently the line-height based on a specific element’s width. This allows for a perfect character count per line at any screen width.
This is a plugin that splits headlines into rows before resizing each row to fill the available horizontal space.