Community driven list of useful things for front-end developers. How to contribute?
- Chrome Canary
- Internet Explorer 10
- Opera Next Desktop, Opera Beta Mobile
- WebKit Nightly
- Firefox Nightly, Firefox Aurora
- Firefox:
- Opera:
- Safari
- Chromium:
- Internet Explorer:
- IE 10
- IE 9
- Any version - Any version of IE on any Windows version, free VM images
- Browser Logos — collection of high resolution web browser logos with transparent backgrounds
- Chrome Dev HTTP Client
- Postman - useful tool for RESTful APIs
- Firebug
- Web Developer for Firefox
- Chrome DevTools Casts for beginners
- LiveReload - Provides Chrome browser integration for the official LiveReload apps (Mac & Windows) and third-parties like guard-livereload and yeoman.
- Live HTTP Headers — Provides information about the HTTP headers
- Dimensions - You can measure everything you see in the browser
- browsersync.io - Time-saving synchronised browser testing
- Dabblet — interactive playground for quickly testing snippets of CSS and HTML
- JSBin — JavaScript, HTML and CSS playground
- gist.github — code snippets
- GitLab Snippets — code snippets
- JSFiddle — JavaScript, HTML and CSS playground
- CodePen — Another JS, HTML, CSS sandbox
- RegExr — regular expression playground
- PNG compressor
- Tiny png — can make IE6 friendly PNGs
- IMGO — image optimization tool
- SVGO — SVG optimization tool
- JPEG compressor — your photos on a diet
- Smush.it — online image optimization tool
- placehold.it — a quick and simple image placeholder service. By the way placekitten & placeboobs
- lorempixel — placehold random images with dummy text
- SpritePad — Sprite generator
- Favicon Cheat Sheet — Favicon Cheat Sheet
- Favicon generator — draw your favicon
- Real Favicon Generator — Generate the favicon pictures and HTML code that work on all major browsers and platforms
- Grumpicon — tool processes a set of SVG files, generates PNG fallback images for legacy browsers – Smarticons – Customizable SVG icon system for the modern web.
- XML to JSON
- MicroJS — helps you discover the most compact-but-powerful microframeworks
- JavaScript Beautifier
- pro.jsonlint.com — pro version of jsonlint.com
- JavaScript Patterns Collection
- Learning JavaScript Design Patterns
- Oboe.js - Streaming JSON loading for Node and browsers
- Polymer - Polymer is a library that uses the latest web technologies to let you create custom HTML elements
- x-tags - is a small JavaScript library, created and supported by Mozilla, that brings Web Components Custom Element capabilities to all modern browsers
- KeyCode - Easy visualizer for JavaScript KeyCodes
- TodoMVC — helping you select an MV* framework.
- Backbone.js — give your JS App some Backbone with Models, Views, Collections, and Events.
- Knockout — is a JavaScript MVVM library that makes it easier to create rich, desktop-like user interfaces with JavaScript and HTML.
- Knockback.js — provides Knockout.js magic for Backbone.js Models and Collections.
- React - A JavaScript library for building user interfaces
- AngularJS
- Ember.js
- CanJS
- Spine — lightweight MVC library for building JavaScript applications.
- Batman.js — is a framework for building rich single-page browser applications with CoffeeScript or JavaScript.
- Dojo
- Agility.js — is an MVC library for client-side Javascript that lets you write maintainable code without compromising on development speed. It's write less, do more with maintainability.
- Closure Library is a broad, well-tested, modular, and cross-browser JavaScript library.
- Metro JS - plugin for jQuery which enables the Modern UI interface on the web.
- toastr - simple JavaScript toast notifications.
- jsdb.io — The definitive source of the best JavaScript frameworks, plugins, and tools
- Jasmine
- Mocha
- QUnit
- Buster.js
- YUI Test
- D.O.H.
- wru
- sinon - Standalone test spies, stubs and mocks for JavaScript
- protractor - E2E test framework for Angular apps
- Chai - Chai is a BDD / TDD assertion library for node and the browser that can be delightfully paired with any javascript testing framework
- expect.js - Minimalistic BDD-style assertions for Node.JS and the browser
- should.js - BDD style assertions for node.js
- HTML5 Rocks
- html5please
- mobilehtml5
- DirtyMarkup - Quick/easy HTML auto formatting
- HTML5Pattern - HTML5Pattern is a source of regularly used Input-Patterns.
- HTML 5 Outliner
- (X)HTML5 Validator
- Template-Engine-Chooser!
- Handlebars
- ICanHaz.js
- Hogan.js — JavaScript templating from Twitter.
- Jade
- EJS
- JUST
- Closure Templates
- ECT — JavaScript template engine with CoffeeScript syntax
- Dust — Asynchronous templates for the browser and node.js
- TwigJS — A port of PHP template engine to JavaScript
- yate — Yet Another Template Engine
- yate.io — Playground for Yate
- Ractive - Next-generation DOM manipulation
- cnCt — Building DOM from JSON-templates
- nunjucks — JavaScript port of Jinja2
- Data URL Toolkit, online service
- css3please — The Cross-Browser CSS3 Rule Generator
- The CSS3 Test — check your browser!
- CSScomb — tool for sorting CSS properties in specific order
- Procssor — CSS Beautifier
- Eric Meyer's reset
- normalize.css
- CSS Gradient finder
- CSS Gradient generator
- Sprite Cow — CSS Sprites
- CSS3 Transitions, Transforms and Animation Tutorial
- Easing animation tool
- Cubic-Bezier
- Easings function
- cssdb.co — Popular CSS Libraries
- Helium — JavaScript tool to scan your site and show unused CSS
- The Responsinator — helps to see responsive site will look on the most popular devices
- Stylie — A fun CSS animation tool
- autoprefixer — Parse CSS and add prefixed properties and values by actual Can I Use database
- Patternify — Draw your own Pattern then just copypaste CSS code
- Screensiz.es - Table of characteristics of popular devices.
- DPI Love - Calculation DPI of devices.
- Device pixel density tests
- CSS3 Generator
- Ultimate CSS Gradient Generator
- :nth Tester
- The CSS3 test
- The 3D CSS text generator
- Get Your Nested Border Radii Right!
- extractCSS is an online tool which can extract ids, classes and inline styles from HTML document and output them as CSS stylesheet
- CSS Explain — Think of it like SQL
EXPLAIN, but for CSS selectors.
- Less
- CSS to Less
- LESS Elements – a set of useful mixins for the LESS
- lesshat.com – smart LESS mixins
- Sass and SCSS
- CSS to Sass
- Compass
- sassmeister — playground for Sass
- Bourbon — A simple and lightweight mixin library for Sass. Also, neat.
- Stylus
- nib — library for the Stylus, providing robust cross-browser CSS3 mixins
- xCSS — PHP based CSS preprocessor
- Roole — a language that compiles to CSS
- Rework — arbitrary CSS preprocessing library for node.js and the browser
- Semantic UI — Semantic empowers designers and developers by creating a language for sharing UI.
- Twitter bootstrap
- Zurb Foundation
- YUI
- Blueprint CSS
- HTML5 boilerplate — The web’s most popular front-end template
- HTML5 mobile boilerplate — A best practice baseline for your mobile web app
- HTML5 Reset – One more boilerplate
- HTML Email boilerplate
- Initializr — Choose your boilerplate
- 960gs — CSS grids system framework
- The Semantic Grid System
- 1140 CSS Grid
- Fluid 960 Grid System
- Less Framework
- Skeleton
- inuit.css
- baseline
- Frameless grid
- Kube
- Topcoat
- Ratchet - Build mobile apps with simple HTML, CSS, and JS components.
- Material Design Lite – An implementation of Material Design components in vanilla CSS, JS, and HTML.
- Marx – The stylish CSS reset. No JavaScript. No Classes. Just raw CSS.
- Wee – Mobile-first lightweight front-end framework.
- Meteor - Meteor is an open-source platform for building top-quality web apps in a fraction of the time, whether you're an expert developer or just getting started.
- Google Apps Script - Build web apps and automate tasks with Google Apps Script
- Github style guide
- Google style guide
- NPM Coding Style
- Code Conventions for the JavaScript Programming Language by Douglas Crockford
- Dojo Style Guide
- jQuery JavaScript Style Guide
- Airbnb JavaScript Style Guide
- Harry Roberts' CSS Guidelines
- SMACSS — Scalable and Modular Architecture for CSS
- OOCSS — Object oriented CSS
- BEM — Block Element Modificator
- DoCSSa {dok~sa} — Sass based CSS architecture and methodology
- Pragmatic jQuery Style
- Principles of writing consistent, idiomatic CSS and HTML
- Idiomatic.js — principles of writing consistent, idiomatic JavaScript
- Pragmatic.js code style guidelines
- U.S. Web Design Standards – a library of open source UI components and a visual style guide for U.S. federal government websites. Also here
- KSS
- StyleDocco
- Source
- StyleDown
- SassDown
- SC5 Styleguide — Informative and easily navigable live styleguide which can be edited directly in the browser
- Styleguides.io – Website Style Guide Resources
- caniuse
- jquer.in - A collection of jQuery plugins organized according to their category.
- The Toolbox — a collection of the best time-saving apps, tools, and widgets from around the web
- humans.txt
- angular-js.in - A curated list of angular directives and modules.
- robots.txt
- Adobe Edge Inspect
- Unicode Emoticons
- Special Characters Easy to Paste
- Entity Conversion Calculator
- ipsum.me
- Schema.org — Most modern microformat documentation supported by Google, Bing, Yandex and Yahoo
- Microformats.org — hcard, hcalendar and etc.
- base64 converter (from computer)
- pasteboard.co — image sharing web app
- Color Scheme Designer - find resonate colors for a great design.
- Windows-8-like animations with CSS3 and jQuery - a demo made by Sara Soueidan about creating a Modern UI design like in Windows 8.
- CSS-Tricks snippets — useful code snippets
- TypeScript
- JSDB.io - The Database of JavaScript Libraries
- Prepros — CSS/JS preprocessor(LESS, Sass, SCSS, Stylus, Jade, Slim, CoffeeScript, LiveScript, Haml and Markdown), minifier and image optimization
- Front-end Frameworks Compare - Comparing front-end frameworks for faster and easier web development.
- Gridlover - Tool to establish a typographic system with modular scale and vertical rhythm.
- Unicode Table - Unicode character table.
- Graphemica - One more unicode character table.
- Web Developer Checklist
- fuckyeahmarkdown.com — Online HTML to Markdown converter with API and stuff. – Coolors – Fast color scheme generator.
- YUI JS, CSS compressor
- CSSO — Cleaver CSS optimizer
- YSlow — Cross-browser plugin for page speed and performance testing
- Google page speed — Page speed measurement tools collection from Google
- Web page test — Check page speed from multiple locations around the globe using real browsers
- jsPerf — JavaScript performance playground
- Google CDN
- Yandex CDN
- Microsoft CDN
- cdnjs — We host it all - JavaScript, CSS, SWF, images, etc
- BootstrapCDN - Delivering: Bootstrap, Bootlint, Font Awesome and Bootswatch
- jQuery Docs
- Try jQuery
- MDN
- dochub.io — CSS, HTML, JavaScript, DOM, jQuery, PHP, Python
- devdocs.io — HTML, CSS, DOM, DOM Events, JavaScript, jQuery
- overapi.com — Collecting All Cheat Sheets
- Bento — Everything you need to know about web development. Neatly packaged.
- Superherojs.com - This site is a continuously updated list of articles that help explain the syntax of JavaScript, how to organize your projects, how to test your code, and what's on the horizon.
- JSBooks - JSBooks the best free JavaScript books/resources
- WebPlatform.org - Open community of developers building resources for a better web, regardless of brand, browser or platform
- W3C HTML Validator
- W3C CSS Validator
- CSSLint — static analysis tool for CSS code
- RECSS — A simple and attractive code quality tool for CSS built on top of LESS
- SCSS-Lint - Configurable tool for writing clean and consistent SCSS
- JSLint — The JavaScript Code Quality Tool by Douglas Crockford
- JSHint — community-driven tool to detect errors and potential problems in JavaScript code
- JSCS — JavaScript Code Style checker
- CSSFontStack
- Font Squirrel
- Google WebFonts
- Fontcustom — command line utility to generate fonts from separate svg/eps files
- Fontello — easy way to combine selected icons from popular icons sets into custom made font
- Online Font Converter
- Check font name by screenshot
- Font Awesome - The iconic font designed for Bootstrap
- Entypo - command line utility to generate fonts from separate svg files. This is possible to associate each icon with a symbol
- Font Family Reunion - Compatibility tables for default local fonts.
- Grunt - Javascript task runner
- Gulp - Javascript task runner based on node streams
- Yeoman - Developer workflow
- Brunch - Brunch is an assembler for HTML5 applications
- Bower - Javascript package manager
- Jam - Jam is a package manager for JavaScript
- Component - Component package manager for building a better web
- Karma test runner - Spectacular test runner for Javascript
- browser-repl - Launch a repl on your command line to any browser in the cloud
- CodeKit — web-dev workflow in the one app: compile everything, autorefresh all browsers, catch errors, add source maps
- Sketch — beautiful, simple, and powerful vector graphics app.
- Google Web Designer — tool for creating interactive HTML5-based designs and motion graphics
- ColorSnapper — easy-to-use tool for quickly finding out the color of any pixel on the screen
- Gitbox — version control as easy as Mail
- LiveReload — "As soon as you save a file, it is preprocessed as needed, and the browser is refreshed..."
- PixFit — measure tool
- xScope — for measuring, inspecting & testing on-screen graphics and layouts
- MAMP PRO — Mac, Apache, MySQL and PHP
- DataURLMaker
- ImageOptim — drag'n'drop UI and various optimisation tools
- ImageAlpha — converts 24-bit PNG to paletted 8-bit with full alpha channel
- BLESS CSS — fighting IE's CSS selectors limit, and nice tool for checking CSS selectors count
- Kaleidoscope — a nice diff tool
- Dash — gives you instant offline access to 80+ API documentation sets.
- Ghostlab — responsive development workflow tool that allows for synchronized testing of your web app across multiple devices — similar to Edge Inspect
- ClipMenu — A clipboard manager for Mac OS X
- GitHowTo
- Pro Git
- Try Git
- LearnGitBranching
- Gitflow - A collection of Git extensions to provide high-level repository operations for Vincent Driessen's branching model.
- Git Cheat Sheet
- Githug — Git Your Game On
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent