前端的一些资料和工具

May 18, 2015


这里记录一些我用到的或者见到的比较好用方便的前端开发相关的工具吧。


色彩与图标

CSS滤镜

界面:

Filter Effects

有各种各样的滤镜效果,可以直接调节参数观察变化。

值得一提的是,这个网站还有很多其他 css 生成器。

比如:Border Image, Border Radius, Box Shadow, Filter Effects, Multi-Column, Outline Border, Overflow(x,y), RGBa, Text Rotate, Text Shadow, Textarea Resize, Transform


渐变CSS代码生成器

界面如下图:

Ultimate CSS Gradient Generator

目前 css 写渐变还很复杂,但是用了这个工具简直太方便了,直接生成 css 代码,还能兼容 ie。


QQ截图取色-16进制

在按下 Ctrl+Shift+A 后,再按一下 Ctrl 就可以看到截图框下面的颜色代码变成16进制的代码了。

如下图:

普通截图:

normal

按住 Ctrl

press ctrl

可以看到第一幅图中的 51, 51, 51 变成了 #333333。


配色

  • nipponcolors

    日本的一个配色网站。罗列了很多不饱和经典的颜色,当然,自己选配还是很重要的。

    nipponcolors

  • Adobe Color CC

    Adobe 出的在线配色工具,里面有些现成的配色方案还是很不错的。

    Adobe Color CC

  • paletton

    提供了各种预览模式,可以在模板网站中预览,在色块中预览。

    paletton


图标

  • easyicon

    对中文的搜索支持很好。实际上它是先把中文翻译为英文再搜索的。

    easyicon


数据处理

Json

  • json editor

    将json数据输入进去,会生成一个树形的结构,方便查看每个节点。

    jsoneditor


本文不定期更新。