This article was published 6 years ago, therefore the contents of this post may be out of date.

JavaScript and CSS libraries are incredibly useful tools for any web developer to be familiar with, as they can add some powerful functionality to your site or spruce up the design, resulting in a better experience for your users.

While there’s an endless number of resources out there, Today in this post you will see that I’m showcasing 15 interesting JavaScript and CSS Libraries that are sure to take your site to the next level. So lets begin

1. Nerv

Nerv is a virtual-dom based JavaScript (TypeScript) library with identical React 16 API, which offers much higher performance, tinier package size and better browser compatibility.

2. List

List, gives you a fast functional alternative to arrays. It’s immutable which makes it a great choice for people who are experimenting with functional programming. List is written in TypeScript and implements all JavaScript array methods plus some extra ones.

3. Scratches

This is just a simple editor that evaluates your source text as you type. It’s electron, so you have the node and browser APIs.

4. NativeScript

NativeScript is a framework for building native iOS and Android apps using JavaScript and CSS. NativeScript renders UIs with the native platform’s rendering engine, no WebViews, resulting in native-like performance and UX.

5. Hover

A collection of CSS3 powered hover effects to be applied to links, buttons, logos, SVG, featured images and so on. Easily apply to your own elements, modify or just use for inspiration. Available in CSS, Sass, and LESS.

6. CSS Nano

CSS Nano is a modern, modular compression tool written on top of the PostCSS ecosystem, which allows us to use a lot of powerful features in order to compact CSS appropriately.

7. Material Design Icons

Material Design Icons is a simple, modern and beautiful icon set created by Google. It includes more than 900 icons, customized only with CSS. The icons are vector-based and look great on all screensizes, retina displays and low-dpi screens.

8. basicScroll

basicScroll allows you to change CSS variables depending on the scroll position. Use the variables directly in your CSS to animate whatever you want.

9. Normalize.css

Normalize.css is a modern library for CSS reset. It provides better cross-browser consistency of the default styles of HTML elements and also minimizes browser inconsistencies, and improves usability.

10. Radi

Radi is a fast and easy to use front-end javascript framework. It offers a simple way to build single-page or more complex applications. It is really tiny, only 3kb minified and gzipped, and doesn’t use any diffing algorithms or virtual dom, plus it requires no dependencies.

11. TensorFlow.js

TensorFlow is an open-source library for defining,training and deploying machine learning models in your browser. It allows you to build neural networks from scratch using high-level APIs and import, run and retrain existing models. What is more, TensorFlow supports WebGL and can work with GPU acceleration.

12. Sympact

Sympact is a minimal library for calculating the CPU and memory usage of tasks in Node.js. It executes a script and evaluates its execution time, CPU usage, and memory usage, then returns a report containing the averages of the results. In addition, it comes with a CLI for a better user experience.

13. 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.

14. Flat Remix CSS library

A lightweight CSS library that provides a set of predesigned elements for a fast web development. It follows a modern “flat” design using high contrasts and sharp borders.

15. Pressure

Pressure is a JavaScript library for handling both Force Touch and 3D Touch on the web, bundled under one library with a simple API that makes working with them painless.


15 Interesting JavaScript and CSS Libraries