社区
CSDN

较为全面的IT社区和服务平台,提供各个技术的知识结构图谱。

GitHub

全球最大的开源项目基地。进阶路上必不可少的学习,分享社区。

InfoQ

促进软件开发领域知识与创新的传播。

Medium

高质量的媒体平台。

SegmentFault

中国区纯粹、高质量的技术交流平台。

Stack Overflow

全球最大的技术问答类在线社区,在上面可以找到几乎所有问题的答案。

V2EX

一个汇集各类奇妙好玩的话题和流行动向的网站。

博客园

技术类博客平台,有很多干货。

开源中国

为开发者提供发现、使用、交流开源技术的平台。

教程
Awesome search

让你更快获取各类优秀资源。

codrops

附带演示的 Javascript 和 CSS 效果教程。

freeCodeCamp

边做边学,通过挑战闯关的模式在实践中练习掌握知识。

MDN

提供开放的Web技术,包括HTML、CSS和API等学习资源。

Tutorialzine

拥有高质量的教程和文章库。

W3C中国

万维网联盟(World Wide Web Consortium, W3C)中国总部

W3school

从基础的HTML到CSS,乃至进阶的XML、SQL、JS、PHP 和ASP.NET中文教程。

web.dev

在 web.dev 的指导下,你可以为你的用户提供最佳体验,无论他们身在何处。

极客学院

涵盖 30+ 个技术领域,如 Android、iOS、HTML5、Apple Watch 等图文教程。

网易云课堂

顶尖中文大学计算机专业课程体系,自由选择喜欢的课程免费进行学习。

菜鸟教程

提供HTML、CSS、Javascript、PHP、MySQL等各种编程语言的基础知识。

UI 框架
AdminLTE

基于 Bootstrap 3.x 的免费后台 UI 框架。提供一系列可重复使用和常用的组件。

Amaze UI

开源 HTML5 跨屏前端框架,分为 Web 版与 Touch 版,轻量级,高性能。

ANT DESIGN

致力于提升『用户』和『设计者』使用体验的中台设计语言。

AUI

采用容器+布局结构+控件的嵌套形式,方便开发者快速布局样式。

Bootstrap

简洁、直观、强悍的前端开发框架,也是目前最受欢迎的UI框架。

Flat UI

基于Bootstrap的平面UI风格框架,非常漂亮。

Foundation

易用、强大而且灵活的 HTML,CSS 和 JavaScript 框架。

Framework7

全功能HTML框架,内置多种 iOS 和 Android 原生皮肤及效果。

Frozen UI

简单易用,轻量快捷的移动端 UI 框架。基于手Q样式规范,选取最常用的组件。

HTML5 Boilerplate

专业的前端模版,用以开发快速、健壮、适应性强的 app 或网站。

jQuery WeUI

专为微信公众账号开发而设计的 UI 库,包含全部 WeUI 官方的 CSS 组件。

marko

来自 ebay 的一个友好和超快速的 UI 库。

Material Design Lite

可创建 Material Design 外观,不依赖任何 JavaScript 框架,旨在优化跨设备使用。

Material-UI

一套实现了 Google Material Design 的第三方 React 组件。

MDC-Web

基于 Material Design ,高度模块化和可定制UI组件。

Milligram

用于更好的性能和更高的生产力,重置属性更少。Gzip压缩后只有2kb。

min

世界上最小的(995字节)CSS框架。逆天的适用于IE5.5及所有主流浏览器。

Mint UI

基于 Vue.js ,由饿了么维护,包含丰富的 CSS 和 JS 组件。

MUI

以iOS平台UI为基础,补充部分Android平台特有的UI控件,不依赖任何第三方JS库。

Pavilion

轻量级CSS框架,多功能的网格系统和常见的UI元素。其余的由你决定。

Picnic CSS

轻量级和简单的CSS框架,高度语义化的HTML5,尽可能少的改变HTML。

Pure.css

轻量级、响应式 css 模块,小的没有节操,gzip 压缩后只有4.4KB。

Semantic UI

完全语义化的前端界面开发框架。官方提供中文文档。

uikit

一款轻量级、模块化的前端框架,界面偏向于简约。

WeUI

同微信原生视觉体验一致的基础样式库,由微信官方设计团队量身设计。

前端框架
Angular

一套框架,多种平台-移动端 & 桌面端。

Ionic

领先的 HTML5 移动开发框架和 SDK ,利用 web 技术构建难以置信的移动应用。

jQuery

快速,小巧,功能丰富的JavaScript库。

Nerv

一款由京东凹凸实验室打造的类 React 前端框架。体积轻量,性能高效,兼容 IE8。

React

用于构建用户界面的JavaScript库。

React Native

使用JavaScript和React构建原生移动应用程序。

Vue.js

渐进式JavaScript框架。超快虚拟 DOM 。

Weex

使用同一套代码来构建 Android、iOS 和 Web 高性能原生应用。来自阿里巴巴。

wepy

微信小程序组件化开发框架,来自腾讯。

zeptojs

一款适用于现代浏览器的简约JavaScript库,与jQuery兼容API。

字体/图标
Adobe Edge Web Fonts

500+免费Web Fonts。

Bytesize

SVG图标库,可使用 stroke 灵活调整图标的线条宽度。

Dripicons

包含PSD, AI, EPS, PDF, SVG, Sketch, Webfont。

easyicon

提供超过五十万个PNG、ICO、ICNS格式图标搜索、图标下载服务。

Feather

简单漂亮的SVG图标合集,强调简单性,一致性和可读性。提供SVG Sprite。

FindIcons

超过30+万个免费图标,以PNG、ICO、ICNS格式为主。

Font Awesome

包含webfont和SVG的流行图标库,内置简单的颜色样式和动画。

Fontello

可在线灵活定制你自己的icon font字体图标字库。

Fonts.com

提供高质量的桌面和网页字体。

Glyph

语义和多功能的SVG图标集。可使用IMG标签和SVG icon组件载入,可自定义 sprite。

Google Fonts

谷歌开源字体库。

Google Material icons

900多种材料设计图标,提供各种尺寸和密度的SVG、PNG以及webfont。

IcoMoon

5500 +免费图标,可导出SVG。也可导入你自己的SVG进行编辑。

iconfinder

强大的图标搜索引擎,2200000+图标涵盖SVG, PNG, CSH 和 AI 格式。

Iconfont

阿里矢量图标库。提供eps、SVG、PNG格式图标下载、在线存储、格式转换等功能。

Iconic

包含SVG、webfont、PNG、WebP,多种CSS风格和尺寸。

Icons8

68,800 个免费的扁平化图标,在 20 秒内生成任何格式、大小和颜色。

Ikons

包含SVG,AI,ESP,PSD,CSH和PNG格式的300个自定义图标。

Octicons

由GitHub构建的一组SVG图标。

Typekit

每天带来数千种美丽的字体。可在web或桌面应用中使用。

CSS 工具
30秒CSS

你可以在30秒或更短的时间内理解有用的CSS代码片段。

Autoprefixer

PostCSS插件,最流行的 CSS 处理工具之一。

ColorZilla

CSS3 渐变生成工具。

CSS Protips

一系列可帮助你掌握CSS技能的提示。

CSS3 Maker

在线生成 CSS3 属性。

cssnano

优化压缩CSS格式,适用于生产环境,由PostCSS提供支持。

CSSPIN

模块化的CSS Spinners和Loaders,可定制单个HTML元素代码。

CSSreference

免费的CSS视觉指南,通过图解和动画示例对CSS属性进行解释。

CSSTree

对CSS语法有效性进行快速详尽解析。

CSS美化压缩

基于YUI compressor内核压缩。

Easing Functions Cheat Sheet

通过动画指南,你可以直观的了解或使用缓动函数。

Emmet

利用Emmet,你能够输入可动态解析的CSS类表达式,并根据缩写生成输出结果。

est

一个基于 Less 的样式工具库,帮助你更轻松地书写 Less 代码。

Flex Layout Attribute

基于 CSS flexbox 规范的 HTML 布局助手。

Grid.Guide

这个小巧的应用能让你通过自定义间距和列数建立你自己的栅格方案。

LESS

CSS 预处理语言,增加了变量、Mixin、函数等特性。基于JavaScript运行。

minireset.css

一个轻量级的 CSS reset。

Normalize.css

使浏览器可以更加一致地呈现所有元素,并符合现代标准。可替代CSS reset。

PostCSS

一个允许使用 JS 插件转换样式的工具。附带很多优秀功能。

purifycss

删除未使用的CSS。也适用于单页面应用。

SASS

CSS 预处理语言,增加了变量、Mixin、函数等特性。在服务器端处理。

Sprite Cow

在线CSS Sprites定位工具(仅支持png透明背景)。

stylus

基于node.js,富有表现力的、动态的、健壮的CSS。

JavaScript 工具
Chrome Dev Tools

内置在Google Chrome中Web开发和调试工具。

ESLint

一个插件化的JavaScript代码检测工具。

Firefox Developer Tools

火狐提供的在 PC 和移动设备上检查,编辑,调试工具。

flow

JavaScript静态类型检查器,帮助你安全地进行重构。

JSHint

可以检测JavaScript代码中的错误和潜在问题。

JS压缩,格式化

多种模式提供JS压缩、解压、格式化、混淆加密、解密。

UglifyJS

用于 JavaScript 的压缩、解压、美化、混淆等。

前端工具
Bower

用于管理前端依赖的包管理器,提供了大量可供使用的依赖包。

Browserify

让你使用类似于 node 的 require() 方式来组织浏览器端的 Javascript 代码。

Brunch

简单且速度很快,自动生成Source Map,方便开发者Debug。

Git

先进的分布式版本控制系统。用于敏捷高效地处理任何或小或大的项目。

Grunt

帮你自动化执行压缩,编译,单元测试等重复性任务。

Gulp

用于在开发工作流程中自动执行重复或耗时的任务。

NPM

NPM包管理器可用于前后端,有超过475,000个模块。

webpack

Webpack用于编译JavaScript模块,编译后的文件用于在浏览器中使用。

Yarn

Yarn 会缓存它下载的每个包。并且会在每个安装包被执行前校验其完整性。

Yeoman

一个强健的工具,库,及工作流程的组合。整合了Grunt、Gulp,NPM、Bower。

配色/灵感
Behance

展示和发现创意作品。内含大量优秀原创设计作品。

BrandColors

世界著名品牌的颜色代码合集。

color hunter

上传图片即可自动创建配色方案。

Color wheel

提供大量免费配色主题。可输出CMYK、RGB、LAB、HSB、HEX。

dribbble

在线查看设计师已经完成的作品或者正在创作的作品。

freehtml5.co

大量免费和高级 HTML5 模板。

Material Design color

Google 提供的 Material Design 配色方案。

Material UI

一套可帮助你快速设计或开发网站和应用程序的颜色工具包。

Materialette

基于Material Design的调色板应用。可安装在桌面端使用。

Mobile Patterns

一个集合iOS界面截图给设计者灵感的酷站。

Palettab

随机展示字体和颜色。提供chrome和firefox浏览器插件。

ThemeForest

业内最大的网站模板和CMS主题商城之一,灵感不需要付费:P

UI中国

专业的界面设计师交流、学习/展示平台。

优设-UISDC

涵盖WebUI,GUI,ICON,PSD,笔刷,模板,字体等资源。

站酷(ZCOOL)

中国人气设计师互动平台。

腾讯设计导航

云集高质量设计网站的内容以及大量设计素材,为设计灵感保驾护航。

花瓣

设计作品采集站,收集灵感的地方。

兼容、性能测试
Browser Sandbox

在线运行任何浏览器,包括Chrome,Firefox,IE 8,IE 9,IE 10和IE 11等。

Browserdiet

权威的前端性能指南。

browsershots

你可以提交一个网址,然后在各个浏览器中显示其兼容性。

BrowserStack

在所有真实的移动和桌面浏览器中,对Web进行实时测试

Can I use

提供最新的浏览器支持数据,显示某些CSS属性在各个平台的兼容性。

httpstatus

检查测试网站状态码、响应头和重定向。

Observatory

检查网站安全协议配置,包括CSP,SSL以及TLS。

PageSpeed Insights

分析网页内容,然后提供关于如何提升网页加载速度的建议。

Security Headers

一个快速扫描网站安全头信息的网站。

其他
360 前端静态资源库

由奇舞团支持并维护的开源项目免费 CDN 服务,囊括上千个前端资源库和 Google 字体库。

cdnjs

非常全面的开源静态资源CDN,加速你的网站。

CodePen

面向开发人员的社交开发环境。可在线编辑测试HTML、CSS、JavaScript。

css-tricks

主要分享CSS样式的技巧、经验和教程等。

dev tips

以gif的形式,展示Chrome DevTools开发技巧。

Douglas Crockford

JSLint 作者,《语言精粹》作者。

Js Tips

每天分享一个JavaScript小技巧! 由全球开发者共同维护。

jsDelivr

开源静态资源CDN,专注性能、可靠性和安全性。中国大陆区域可用。

JSFiddle

Web开发人员的练习场,可在线编辑和测试 HTML、CSS、JavaScript代码片段。

quirksmode

主要关于JavaScript的一些干货。

Unheap

轻松快速的找到各种最新的 jQuery 插件。