前言

我们有时候因为某些原因突然想去访问某个网站，但是却想不起来是哪个网站，所以整理一些常用的工具类网站。建议在浏览器建一个 工具 文件夹书签，将这些网站收藏，便于以后使用

1. carbon 生成漂亮的代码图片，有几十种风格和语言可选；当我们在分享代码的时候，总想搞几张漂亮的代码图片。类似的 vscode 插件 Polacode

   

2. shields.io 经常在 github 上面的一些库上面看到一些如下图所示的徽章。就是shields.io网站生成的。可以自定义样式

3. disqus 当想在自己网站上添加评论功能的时候，添加几行代码就可以。

4. placeholder 占位图片，当我们开发时需要图片却没有真实图片的时候，非常有用。类似有picsum.photos

5. codepan.net 在线代码编辑器。 @egoist 开源的，不需要翻墙，非常轻量，便捷。类似于codepen,jsbin

6. Octotree github 必备插件

7. browsehappy 当客户浏览器版本太低需要提示下载高版本浏览器的时候

<!--事例代码 参照AlloyTeam-->
<!--[if lt IE 9]>
   <div class="browserupgrade">
        <div class="tip">"Duang"，你被鄙视了，还在用这么Low的浏览器，快去升级吧！</div>
        <div class="tip-author"> -by AlloyTeam </div>
        <a href=" http://browsehappy.osfipin.com/ ">点我去升级</a>
    </div>
    <style>.main{display:none}</style>
<![endif]-->

8. loading.io 可以制作各种 loading

9. device metrics 各种移动设备的尺寸及相关信息

• mydevice.io
• devices.css 用纯css实现的主流手机外壳

10. 趋势对比图网站，需要调研的时候有用

• www.npmtrends.com
• trends.google.com
• gs.statcounter.com
• 2017.stateofjs.com
• index.baidu.com

11. 需要自己制作 logo 的时候 类似的制作工具有
    • LogoMakr logo
    • favicon 制作 favicon
    • realfavicongenerator favicon
    • spritegen 生成css雪碧图
    • tinypng 手动压缩图片
    • clippy css-clip path maker

小结

以上就是本人经常使用的部分工具网站，希望大家有其他的工具类网站也与大家分享下。