学科:Web前端/辅助工具

JavaScript

• CodePen - a community of front end folks focused on inspiration and education.

与jsfiddle类似，但更强大。支持GitHub登入，支持LESS、SCSS、SASS、CoffeeScript……

• jsfiddle

功能强大。可用来分享代码片段，调试。

• JS Bin

跟jsfiddle相似，但没那么多功能

• jsPerf

JS测试用例，比较几个不同的写法的性能，很有用的工具

受欢迎的测试： http://jsperf.com/popular

• Online JavaScript Beautifier

展开压缩代码，也支持html

• repl.it

在线的多语言终端，对于Js只是一个简单的Chrome console

• gskinner.com/RegExr

很好用的正则表达式辅助工具

CSS代码辅助生成

• CSS3 Generator

• CSS3, please!

仍然强大

• Ultimate CSS Gradient Generator

A powerful Photoshop-like CSS gradient editor from ColorZilla.

• CSS Button Maker by Zhou Qi

• Font2Web

上传.ttf或.otf字体，将其转换为Web字体（.woff，.eot，.svg）并生成相应CSS样式。

辅助插件

• GRUNT.js

Node.js任务自动化

• Koala

Koala is a GUI application for less, sass and coffeescript compilation, to help web developers to use less,sass and coffeescript development more efficient.

国人维护，用的 https://github.com/rogerwang/node-webkit

• Code Cola - Code Cola is a chrome extension for editing online pages' css style visually.

说明：http://www.zhouqicf.com/code-cola

颜色工具

• Color Scheme Designer

配色辅助

• Colorfy It - Website Color Analyzer

给出指定网站用色表

其他

• http://thetoolbox.cc/ The Toolbox: a directory of the best time-saving apps and tools

• Rythem

腾讯一Web前端团队维护的抓包工具

• Unicode Code Converter

Unicode转义

类型：可离线保存

• WhatFont Tool

比Inspector更简单的查看页面字体工具

类型：JS书签

• Powerful Command Line Tools For Developers | Smashing Magazine

• 阿里测

网站质量探测工具

• https://github.com/sindresorhus/pageres

node.js 命令行工具，生成指定网页不同分辨率下的截屏