Web Developer Tools & Resources
Rebar is a responsive SASS/Stylus grid framework. It keeps your CSS organized and makes your development more efficient.
Sassy-validation is a SASS data type validation library. It’s a handy addition for SASS projects that use @functions and/or @mixins.
Sassy-exists is a SASS micro library for existence checks. It provides alternative syntax for variable-exists, function-exists, feature-exists, and more.
Outline is a clean and simple, responsive CSS starter boilerplate. It’s modular and mobile-first, and built with SASS.
Trine is a utility library for modern JavaScript that lets you tap into the full potential of functional programming in JS. It’s designed to be modular from the ground up.
Ity is a tiny, dependency-free JS MVC that’s great for small, mobile-specific apps. It has a tiny footprint for mobile networks (around 5kb minified) and an extremely fast DOM query/selection engine with no need for jQuery.
PurifyCSS helps you remove unused CSS from your websites and web apps (both multi-page and single-page). It can even detect dynamically-loaded CSS selectors in your javascript, and reduce your CSS files dramatically.
Justice.js creates an on-page toolbar that displays page timing metrics and includes a streaming FPS graph. It’s a high level performance discovery tool that provides insight into the performance of a webpage.
FamousEngine is a JS library for building animations and interfaces. It abstracts the DOM & WebGL, allowing you to do custom rendering and layouts.
KinWin.js is a minimalist JavaScript DOM manipulation library. It’s straightforward and easy to use.
PhantomCSS is a CasperJS module for automating your visual regression testing. It’s great for testing live style guides, web apps, and responsive layouts.
Sylvester is a matrix, geometry, and vector library for JavaScript. It includes classes for modelling infinite lines and planes in 3-dimensional space, and for modelling vectors and matrices in any number of dimensions.
Dynamics.js is a JavaScript library for creating physics-based CSS animations. It’s straight-forward to use and works on all modern browsers.
Gradify finds the most prominent colors in an image and turns them into a CSS gradient. The end results are scalable and responsive, and are perfect for image placeholders.
Bootcards is a cards-based UI with dual-pane capability. It works on mobile and desktop, and is built on Bootstrap.
The jQuery.profanity.Filter is a simple client-side profanity filter. It includes a few options, including replacing words with asterisks, pound signs, or random words from a defined list.
jsGrid is a lightweight grid jQuery plugin. It works with any data source, and includes data filtering and editing.
Remodal is a responsive, lightweight modal window plugin that uses synchronized CSS animations. It’s customizable, with declarative configuration and hash tracking.
Rework is a plugin framework for CSS preprocessing in Node.js. It lets you do things like automating vendor prefixing, creating your own properties, and more.
Trunk.js is a responsive web solution for creating better navigation and layouts. It tucks your navigation into the “drawer” on many devices, and while it triggers with jQuery, it moves with CSS for a much smoother effect.
Plyr is a simple HTML5 media player that offers WebVTT captions. It’s lightweight, accessible, and customizable, and works with all modern browsers.
reGrid.js is an in-browser design tool for front-end development. It overlays the fluid grid you specify for each viewport width.
Scally is a Sass-based CSS framework that provides a solid framework for building reusable UIs. It’s responsive-ready and focuses on scalability and configurability.
Primer is the CSS toolkit and guidelines that power GitHub. It includes a small Gruntfile for compiling SCSS, Parker for CSS stats, and Autoprefixer for vendor prefixes.
Rocket.Chat is an open source chat client that you can use for your own web chat. It was developed in JavaScript, using the Meteor fullstack framework.
If you need to detect (and potentially censor) nude images in your site or app, then Nude.js might be the script you’re looking for. Using JavaScript and HTMLCanvas, it scans images for nudity based on approaches from research papers. (The demo is censored and safe for work.)
Clusterize.js is a plugin that allows you to easily display large sets of data. It clusters data so that the DOM isn’t polluted with all the used tags.
Headhesive makes it easy to add on-demand sticky headers to your websites. Just specify where you want your header to become sticky and it does the rest.
Scut is a set of Sass utilities that aims to save time by improving the implementation of common style-code patterns. It helps you avoid repetitive work, more easily implement hacks in your code, and organize your rules, among other features.