web-tools 是由qiilee整理并维护的web相关工具网站集合。如果收录有误，可以通过issue反馈给我

说明：收录来源有segmentfault/lemon、 github/shenzekun

内容

• 图片类
• 代码类
• 效率类
• 查询类
• 综合类
• 工具类
• 周报类
• Nodejs类
• 综合API类
• Ecmascript类
• template类
• CSS类
• Angularjs类
• React类
• vue类
• 移动端类
• jQuery类
• D3类
• Requriejs类
• Seajs类
• Less,sass类
• Markdown类
• 兼容性类
• UI类
• 图表类
• 规范类
• 各大公司开源项目
• 常用类
• 算法类
• JSON类
• 分享类
• 富文本编辑器类
• Gulp/Grunt类
• Fis类
• 在线类
• 优化类
• 前端架构
• 推荐作品
• 简历模板
• 推荐作品
• 面试题
• iconfont
• Fiddler
• Chrome
• Firebug
• 移动微信调试
• 前端导航网站
• 常用CDN

图片类

• Tinypng | 智图 (压缩图片)
• Cool Backgrounds (生成好看的渐变背景图)
• iconfont (阿里巴巴矢量图标库)
• desktoppr (好看的壁纸)
• Iloveimg (批量编辑图片的所有工具。包括压缩图片，剪裁图片，图片加水印，转化至jpg图片等等)
• zoommyapp.com (高质量图库)
• unsplash.com (高质量图库)
• www.pinterest.com (高质量图库)
• New Old Stock (复古风图库)
• 效果网
• 花瓣网
• 优美图
• 17素材
• 摄图网
• SuperSlidev2.1 -- 大话主席
• soChange
• fullpage全屏轮播
• 无缝切换
• 滑屏效果
• 全屏fullpage
• 单个图片切换
• 单个全屏切换
• 百度的切换库
• 滑屏效果
• 旋转拖动设置
• 类似于swipe切换
• 支持多种形式的触摸滑动
• 滑屏效果
• 大话主席pc移动图片轮换
• 滑屏效果
• 基于zepto的fullpage
• [WebApp]定宽网页设计下，固定宽度布局开发WebApp并实现多终端下WebApp布局自适应

代码类

• Ubuntu pastebin (代码分享)
• Codepen (在线代码编辑)
• Jsbin (在线代码编辑)
• CodeSandbox (在线写React,自动编译,有代码提示)
• Ultimate CSS Gradient Generator (生成 css 渐变)
• Grabient (生成漂亮的 css 渐变)
• Character Entity Reference Chart (各种符号的转义字符)
• css三角形产生器
• 缓动函数速查表
• Regexper (正则可视化)
• Regex101 (正则表达式测试)
• Visualgo (数据结构，算法可视化)
• Animista (在线生成 css 动画)
• PageSpeed Insights (测试网站速度，优化性能)
• Learn Git Branching (以动画的形式让你学习 git)
• Asciiflow (生成类似代码注释里那种佛祖的代码。。自己画😄)
• PXtoEM (PX EM 单位换算)
• epic-spinners (一个好看的css loading 代码库)

效率类

• 墨刀 (画原型图)
• 石墨文档 (多人实时协作的云端文档与表格)
• resume-examples (简历模板)
• KOPPT (ppt 模板)
• Canva (设计模板)
• ProcessOn (在线画流程图，思维导图、UI原型图等等)
• WakaTime (跟踪项目花费的时间，得装插件)
• Screen Sizes (移动屏幕尺寸)
• Habitica (游戏化Todo)
• Smallpdf (非常厉害的一个网站，PDF压缩，PDF转PPT，Word，Excel等等都可以直接通过这个页面实现)
• 草料二维码 (在线生成二维码)
• 声享 (在线制作 PPT)
• 幕布 (极简大纲笔记，一键生成思维导图)
• Infogram (在线图表制作工具)
• UZER.ME (能够在线使用ps，ai，office，xmind，火狐浏览器等多个应用的网站)
• NiceTool (在线工具集合网站)

查询类🔎

• devhints (常用速查表，快速查询各类框架和库的常用方法，很实用)
• 印记中文 (快速查询各类框架和周边库的中文文档)
• Css Triggers (列出了哪些CSS属性在不同的渲染引擎中是否会触发重排或重绘)

综合类

• 前端知识体系
• 前端知识结构
• Web前端开发大系概览
• Web前端开发大系概览-中文版
• 免费的编程中文书籍索引
• 前端书籍
• 前端免费书籍大全
• 智能社-精通JavaScript开发
• 重新介绍 JavaScript（JS 教程）
• 麻省理工学院公开课：计算机科学及编程导论
• JavaScript中的this陷阱的最全收集--没有之一
• JS函数式编程指南
• JavaScript Promise迷你书（中文版）
• 腾讯移动Web前端知识库
• Front-End-Develop-Guide 前端开发指南
• 前端开发笔记本
• 大前端工具集 - 聂微东
• 前端开发者手册
• 常用的JavaScript代码片段
• 常用的JavaScript代码片段
• w3help(综合Bug集合网站)

周报类

• 奇舞周刊
• 码农周刊
• JS前端开发群月报
• 平安科技移动开发二队技术周报

Nodejs类

• nodejs 篇幅比较巨大
• Node.js 包教不包会
• 篇幅比较少
• node express 入门教程
• nodejs定时任务
• 一个nodejs博客
• 【NodeJS 学习笔记04】新闻发布系统
• 过年7天乐，学nodejs 也快乐
• 七天学会NodeJS
• nodejs入门
• nodejs cms
• Node初学者入门，一本全面的NodeJS教程
• NodeJS的代码调试和性能调优

综合API类

• javascripting
• 各种流行库搜索
• runoob.com-包含各种API集合
• 开源中国在线API文档合集
• devdocs
• HTTP API 设计指南
• 验证api
• underscore 中文手册
• underscore源码分析
• underscore源码分析-亚里士朱德的博客
• underscrejs en api
• lodash - underscore的代替品
• ext4api
• backbone 中文手册
• qwrap手册
• 缓动函数
• svg 中文参考
• svg mdn参考
• svg 导出 canvas
• svg 导出 png
• localStorage 库

Ecmascript类

• Understanding ECMAScript 6 - Nicholas C. Zakas
• exploring-es6
• exploring-es6翻译
• exploring-es6翻译后预览
• 阮一峰 es6
• 阮一峰 Javascript
• ECMA-262，第 5 版
• es5

template类

• template-chooser
• artTemplate
• tomdjs
• 淘宝模板juicer模板
• Fxtpl v1.0 繁星前端模板引擎
• laytpl
• mozilla - nunjucks
• Juicer
• dustjs
• etpl

CSS类

• CSS 语法参考
• CSS3动画手册
• 腾讯css3动画制作工具
• 志爷css小工具集合
• css3 js 移动大杂烩
• bouncejs 触摸库
• css3 按钮动画
• animate.css
• 全局CSS的终结(狗带 [译]
• browserhacks

Angularjs类

• Angular.js 的一些学习资源
• angularjs中文社区
• Angularjs源码学习
• Angularjs源码学习
• angular对bootstrap的封装
• angularjs + nodejs
• 吕大豹 Angularjs
• AngularJS 最佳实践
• Angular的一些扩展指令
• Angular数据绑定原理
• 一些扩展Angular UI组件
• Ember和AngularJS的性能测试
• 带你走近AngularJS - 基本功能介绍
• Angularjs开发指南
• Angularjs学习
• 不要带着jQuery的思维去学习AngularJS
• angularjs 学习笔记
• angularjs 开发指南
• angularjs 英文资料
• angular bootstrap
• angular jq mobile
• angular ui
• 整合jQuery Mobile+AngularJS经验谈
• 有jQuery背景，该如何用AngularJS编程思想
• [AngularJS在线教程](http://each.sinaapp.com/angular）

React类

• react.js 中文论坛
• react.js 官方网址
• react.js 官方文档
• react.js material UI
• react.js TouchstoneJS UI
• react.js amazeui UI
• React 入门实例教程 - 阮一峰
• React Native 中文版
• Webpack 和 React 小书 - 前端乱炖
• Webpack 和 React 小书 - gitbook
• webpack
• Webpack，101入门体验
• React原创实战视频教程
• react个人所需网站整理

vue类

• Vue 论坛
• Vue 入门指南
• Vue 的一些资源索引
• awesome-vue
• element官方

移动端类

• 99移动端知识集合
• 移动端前端开发知识库
• 移动前端的一些坑和解决方法（外观表现）
• 【原】移动web资源整理
• zepto 1.0 中文手册
• zepto 中文注释
• jqmobile 手册
• 移动浏览器开发集合
• 移动开发大杂烩
• fastclick
• no-click-delay
• ionic

jQuery类

• jQuery API 中文文档
• hemin 在线版
• css88 jq api
• 学习jquery
• jquery 源码查找

D3类

• d3 Tutorials
• Gallery
• lofter
• iteye
• ruanyifeng

Requriejs类

• Javascript模块化编程（一）：模块的写法
• Javascript模块化编程（二）：AMD规范
• Javascript模块化编程（三）：require.js的用法
• RequireJS入门（一）
• RequireJS入门（二）
• RequireJS进阶（三）
• requrie源码学习
• requrie 入门指南
• requrieJS 学习笔记
• requriejs 其一
• require backbone结合

Seajs类

• seajs
• seajs 中文手册

Less,sass类

• sass
• sass教程-sass中国
• Sass 中文文档
• less

Markdown类

• Markdown 语法说明 (简体中文版)
• markdown入门参考
• gitbook(国外的在线markdown可编辑成书)
• mdeditor(一款国内的在线markdown编辑器)
• stackedit(国外的在线markdown编辑器，功能强大，同步云盘)
• mditor(一款轻量级的markdown编辑器)
• lepture-editor
• markdown-editor
• 作业部落(功能强大，速度流畅，全平台同步)

兼容性类

• esma 兼容列表
• W3C CSS验证服务
• caniuse
• csscreator
• [microsoft](https://msdn.microsoft.com/zh-cn/library/cc351024(v=vs.85.aspx)
• 在线测兼容-移动端
• emulators

UI类

• bootcss
• MetroUICSS
• semantic
• Buttons
• kitecss
• pintuer
• amazeui
• worldhello
• linuxtoy
• gitmagic
• rogerdudler
• gitref
• book
• gogojimmy
• MUI-最接近原生APP体验的高性能前端框架
• Amaze UI中国首个开源 HTML5 跨屏前端框架
• 淘宝 HTML5 前端框架
• KISSY - 阿里前端JavaScript库
• 网易Nej - Nice Easy Javascript
• Kendo UI MVVM Demo
• Smart UI
• 雅虎UI - CSS UI

图表类

• Highcharts 中文API
• Highcharts 英文API
• ECharts 百度的图表软件
• 高德地图
• 开源的矢量图脚本框架
• svg 地图

规范类

• 通过分析github代码库总结出来的工程师代码书写习惯
• HTML&CSS编码规范 by @mdo
• 团队合作的css命名规范-腾讯AlloyTeam前端团队
• 前端编码规范之js - by yuwenhui
• 前端编码规范之js - by 李靖
• 前端开发规范手册
• Airbnb JavaScript 编码规范（简体中文版）
• AMD与CMD规范的区别
• KISSY 源码规范
• bt编码规范
• 规范加强版
• 前端代码规范 及 最佳实践
• 百度前端规范
• 百度前端规范
• 百度前端规范
• ECMAScript6 编码规范--广发证券前端团队
• JavaScript 风格指南/编码规范（Airbnb公司版）
• 网易前端开发规范
• css模块
• 前端规范资源列表

各大公司开源项目

• Facebook Projects
• 百度web前端研发部
• 百度EFE
• 百度github
• alloyteam
• alloyteam-github
• alloyteam-AlloyGameEngine
• AlloyDesigner(即时修改，即时保存，设计稿较正，其它开发辅助工具)
• H5交互页编辑器AEditor介绍(动画交互页开发的工具介绍)
• AEditor(动画交互页开发的工具)
• maka
• 值得订阅的weekly
• 腾讯html5
• 奇舞团开源项目
• Qunar UED
• Scrat

常用类

• ieBetter.js-让IE6-IE8拥有IE9+,Chrome等浏览器特性
• 模拟键盘
• 拼音
• 中国个人身份证号验证

算法类

• 数据结构与算法 JavaScript 描述. 章节练习
• 常见排序算法（JS版）
• 经典排序
• 常见排序算法-js版本
• JavaScript 算法与数据结构 精华集
• 面试常考算法题精讲

JSON类

• 模拟生成JSON数据
• 返回跨域JSONAPI

分享类

• 百度分享
• JiaThis
• 社会化分享组件
• ShareSDK 轻松实现社会化功能
• 友盟分享

富文本编辑器类

• 功能齐全 tinymce
• 百度 ueditor
• 经典的ckeditor
• 经典的kindeditor
• wysiwyg
• 一个有情怀的编辑器。Bach's Editor
• tower用的编辑器
• summernote 编辑器
• html5编辑器
• XEditor
• wangEditor

Gulp/Grunt类

• Gulp官网
• Gulp中文网
• gulp资料收集
• Gulp：任务自动管理工具 - ruanyifeng
• Gulp插件
• Gulp探究折腾之路(I)
• Gulp折腾之路(II)
• Gulp不完全入门教程
• 为什么使用gulp?
• Gulp安装及配合组件构建前端开发一体化
• Gulp 入门指南
• Gulp 入门指南 - nimojs
• Gulp in Action
• Gulp开发教程（翻译）
• 前端构建工具gulpjs的使用介绍及技巧
• gruntjs
• Grunt中文网

Fis类

• fis 官网
• fis

在线类

• js 在线编辑 - runjs
• js 在线编辑 - jsbin
• js 在线编辑 - codepen
• js 在线编辑 - jsfiddle
• java 在线编辑 - runjs
• js 在线编辑 - hcharts
• js 在线编辑 - jsdm
• sql 在线编辑 - sqlfiddle
• mozilla 在线编辑器
• google在线工具
• 阿里测
• 阿里-免费测试服务
• 阿里-F2etest多浏览器兼容性测试解决方案
• js性能测试

优化类

• Javascript高性能动画与页面渲染
• 移动H5前端性能优化指南
• 5173首页前端性能优化实践
• 给网页设计师和前端开发者看的前端性能优化
• 复杂应用的 CSS 性能分析和优化建议
• 前端性能监控总结
• 前端技术：网站性能优化之CSS无图片技术
• 浏览器的加载与页面性能优化
• 页面加载中的图片性能优化
• Yslow——性能优化
• YSLOW中文介绍
• 转一篇Yahoo关于网站性能优化的文章，兼谈本站要做的优化
• Yahoo!团队实践分享：网站性能
• 网站性能优化指南：什么使我们的网站变慢？
• 网站性能优化实践，减少加载时间，提高用户体验
• 浅谈网站性能优化 前端篇
• 前端重构实践之如何对网站性能优化？
• 前端性能优化：使用媒体查询加载指定大小的背景图片
• 网站性能系列博文
• 加载，不只是少一点点
• 前端性能的测试与优化
• 分享网页加载速度优化的一些技巧？
• 页面加载中的图片性能优化
• web前端优化(基于Yslow)
• 网站性能优化工具大全
• 【高性能前端1】高性能HTML
• 【高性能前端2】高性能CSS
• 由12306谈谈网站前端性能和后端性能优化
• 毫秒必争，前端网页性能最佳实践
• 网站性能工具Yslow的使用方法
• 前端工程与性能优化（上）：静态资源版本更新与缓存
• 前端工程与性能优化（下）：静态资源管理与模板框架
• HTTPS连接的前几毫秒发生了什么
• Yslow
• Essential Web Performance Metrics — A Primer, Part 1
• Essential Web Performance Metrics — Part 2
• YUISlide,针对移动设备的动画性能优化
• Improving Site Performance
• 让网站提速的最佳前端实践
• Why Website Speed is Important
• Need for Speed – How to Improve your Website Performance
• 阿里无线前端性能优化指南 (Pt.1 加载期优化
• JavaScript 性能分析新工具 OneProfile
• JavaScript 堆内存分析新工具 OneHeap

前端架构

• 技术架构
• 前端架构
• 如何成为前端架构师
• 关于前端架构-张克军
• 百度腾讯offer比较（腾讯游戏VS百度基础架构）

推荐作品

• winter代码片段需要翻墙
• fgm
• 岑安作品集
• 当耐特demo集合
• 米空格 js作品
• myFocus
• SeaJS组件库
• 颜海镜作品
• 脚儿网作品
• javascript个人作品
• 妙味的雷东升游戏作品
• javascript作品集
• 云五笔，灰度产生生成工具
• 项目主页
• 个性的作品主页
• 播放器
• ucren js demos 集
• 智能社
• 实例陈列架
• zoye demo
• 王员外
• 平凡
• jyg 游戏案例
• 很多jquery插件
• 不羁虫 - soJs 作品系列
• frozenui
• 黑白棋
• fromone
• pazguille
• Html5 VideoPlayer
• Proton 烟花

简历模板

• 不错的个人简历
• 简历
• 翁天信
• 动画方式的简历
• 组件丰富简历
• 简历池
• haorooms博客
• Justin Young

面试题

• Web开发笔试面试题 大全
• 前端开发面试题
• 最全前端面试问题及答案总结
• 牛客网-笔试面经

iconfont

• 中文字体
• 淘宝字库
• 字体
• 制作教程
• zhangxinxu-icommon
• icommon
• 用字体在网页中画ICON图标(推荐教程
• 字体压缩工具

Fiddler

• Fiddler调式使用知多少
• 微信fiddle
• 微信fiddle

Chrome

• Google Chrome 官方
• Chrome - 基础
• Chrome - 进阶
• Chrome - 性能
• Chrome - 性能进阶
• Chrome - 移动
• Chrome - 使用技巧
• Chrome - Console控制台不完全指南
• Chrome - Workspace使浏览器变成IDE
• network面板
• chrome开发工具快捷键
• chrome调试工具常用功能整理
• Chrome 开发工具 Workspace 使用
• Chrome神器Vimium快捷键学习记录
• sass调试-w3cplus
• 如何更专业的使用Chrome开发者工具-w3cplus
• chrome调试canvas
• chrome profiles1
• chrome profiles2
• chrome profiles3
• chrome移动版调试
• chrome调试
• chrome的调试
• chrome console 命令详解
• 查看事件绑定1
• 查看事件绑定2
• 神器——Chrome开发者工具
• 奇趣百科性能优化(Chrome DevTools 中的 Timeline Profils 等工具使用介绍
• chrome 开发者工具的 15 个小技巧
• Chrome开发者工具不完全指南
• Chrome 开发者工具使用技巧
• Vimium
• Cmder
• ZSH
• Cmder

Firebug

• firebug视频教程
• firefox 模拟器
• console.log 命令详解
• Firebug入门指南
• Firebug控制台详解

移动微信调试

• 浏览器端调试安卓
• 移动端前端开发调试
• 使用 Chrome 远程调试 Android 设备
• mac移动端调试
• mac移动端调试
• 无线调试攻略
• 无线调试攻略
• 屌爆了,完美调试 微信webview(x5
• 远程console
• 微信调试工具
• 各种真机远程调试方法汇总

前端导航网站

• 大前端
• CSS88
• 网址导航
• 前端开发仓库
• 前端资源导航
• CTOLIB码库
• IT营
• 轮子工厂
• uyi2

常用CDN

• 新浪CDN
• 百度静态资源公共库
• 360网站卫士常用前端公共库CDN服务
• Bootstrap中文网开源项目免费 CDN 服务
• 开放静态文件 CDN - 七牛
• CDN加速 - jq22
• jQuery CDN
• Google jQuery CDN
• 微软CDN

《前端相关》

• SEO关键词查询
• 前端开发导航网站
• HTML5+CSS3
• jquery特效
• 滚动条插件API
• 特效代码齐全
• AngularJS
• 登陆注册切换代码
• 百度图表
• A5源码
• runoob.com
• HTML5研究小组
• UI制造
• MooSee摩色
• 盒子UI
• 移动设备产品设计
• AndroidUI设计指导
• http://www.tappgala.com/
• js特效代码网
• 微信jssdk文档
• ionic
• http://www.runoob.com/ionic/ionic-install.html
• http://www.ionic.wang/css_doc-index.html"
• ngrouter 路由
• angular自定义指令
• ES6
• 阮一峰的es6
• require
• webpack
• http://sentsin.com/web/1089.html
• http://mobile.51cto.com/web-439711.htm
• http://blog.csdn.net/sinat_17775997/article/details/52399818"
• 压缩图片
• 微信小程序
• object defineprototype
• vux
• vuex简介书
• javascript
• 1502FE.A的git网址
• React 网址
• vue视频慕课网
• react.api 极客学院
• http://blog.csdn.net/superskk6/article/details/7405973
• vuex
• 面试
• 移动端的bug
• echarts
• jslite
• 盒子居中
• vuex 1.0
• 后台管理
• 简书
• 日历的插件
• 微信小程序的资料
• 滴滴出行
• https://juejin.im/post/584e48b2ac502e006c74a120?utm_source=gold_browser_extension
• 设备像素比
• 贝塞尔曲线测试
• 1px的border
• 图标字体制作
• elementUI
• mint-u移动端
• 懒人图库
• 远程真机测试 账号qq：33710068
• FIS3 , 为你定制的前端工程构建工具
• HTML5+CSS3
• jquery特效
• 滚动条插件API
• 在线手册
• 特效代码齐全
• AngularJS
• http://www.sucaihuo.com/js/124.html
• 百度图表
• http://down.admin5.com/
• http://www.runoob.com/
• UI制造
• MooSee摩色
• 盒子UI
• 移动设备产品设计
• http://www.tappgala.com/
• 我们主要把优质开发者的业余时间和技能按照小时计费的方式为我们平台的用户提供开发和设计服务，希望有机会合作
• 在线实验babel
• 码工在线
• BeJson功能强大
• 国内知名前端团队
• 前端开发知识结构
• 前端相关工具
• 前端开发相关的优秀网站、博客、以及活跃开发者