20 Javascript & CSS Plugins

In this article, we’ve gathered a collection of 20 awesome JavaScript and CSS plugins for your web & mobile projects. If you saw something that you really like in the list or think something is missing, leave us a note in the comments section.

1. TwentyTwenty

TwentyTwenty works by stacking two images on top of each other. As the slider moves across the image, it makes use of the CSS clip property to trim the image on the left. This allows the image on the right to show through the container.

2. Material Design Hierarchical Display

Hierarchical Timing is a meaningful transition introduced in Google Material Design that focuses your users attention in an app or how an app element got from point A to point B.

3. Chocolat.js

Chocolat.js enables you to display one or several images staying on the same page. The choice is left to the user to group together a series of pictures as a link, or let them appear as thumbnails.

4. Filterable Product Grid

A responsive product grid layout with touch-friendly Flickity galleries and Isotope-powered filter functionality.

5. Readable

Introducing Readable, a jQuery plugin to help you create optimally sized paragraphs for maximum readability. Toggle the switch in the lower right corner to see it in action.

6. FitText

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.

7. Typeahead.js

A flexible JavaScript library that provides a strong foundation for building robust typeaheads

8. Pintsize

Pintsize is built with designers in mind. It aims to make building custom responsive CSS grids used in your designs simple and accurate while maintaining a flexible system for developers.

9. Vivus

Vivus is a lightweight JavaScript class (with no dependencies) that allows you to animate SVGs, giving them the appearance of being drawn.

10. Color Extraction Effect

A little slideshow with a color palette creation effect using CSS Filters and Vibrant.js.

11. Quick [select]

A jQuery pluugin for quick selection of common options in select boxes. Selectual.

12. Texture.js

A Javascript library for creating SVG patterns. Made on top of d3.js, it is designed for data visualization.

13. Roll.js

Roll.js is a tiny javascript library (less than 8kb, no dependencies) to help you keep track of position, scrolling, and pagination.

14. ScrollTrigger

ScrollTrigger is a lightweight javascript library that you can use to trigger classes on HTML elements based on scroll position.

15. Flatpickr

Flatpickr is a new plugin built with javascript (zero dependencies) that generates design agnostic datetime pickers to be included in your website or app.

16. Switch

Switch is a simple but powerful javascript plugin (no dependencies) for creating iOS style switches from simple checkboxes.

17. Barba.js

Barba.js is a small, flexible and dependency free library that helps you creating fluid and smooth transitions between your website’s pages.

18. Mojs

mojs is a motion graphic javascript library for the web for creating stunning animations.

19. Balloon.css

Balloon.css lets you add tooltips to elements without JavaScript and in just a few lines of CSS.

20. Loaders.css

A collection of loading animations written entirely in css. Each animation is limited to a small subset of css properties in order to avoid expensive painting and layout calculations.