美文网首页
设计师都应该安装这个小插件!简直是设计圈里的 One Step

设计师都应该安装这个小插件!简直是设计圈里的 One Step

作者: 殇小辛 | 来源:发表于2017-08-31 12:38 被阅读42次

    你有没有遇到过这样的小困难?

    发现某个网页设计得很好看,很干净,用的字体很漂亮,配色很舒服,于是想知道这个网页的用的什么字体多大字号什么颜色

    举个例子▼

    一个突然的下午,你突然的自我,来到了锤子的官网,看到了这个“足迹系列”手感膜的介绍,感觉看着很干净,字体很好看字号很合适配色很舒服,想知道这用的什么字体什么字号什么颜色

    于是你开始倒腾:

    1、这些文字用了什么颜色?

    1)打开QQ

    2)Ctrl + Alt + A 进入截图模式

    3)小心翼翼地将鼠标悬停在小字上▼

    得到了一个很难记的 RGB 色值

    插播一条小贴士:

    将鼠标悬停在小字上时可以按住 Ctrl 键,这时候你会得到一个十六进制的 RGB 色值(这样直接用到 PPT 等地方)▼

    至此你终于知道了一个可能不太准确的颜色色值

    2、这些文字用的什么字体?

    1)截图你想知道用了什么字体的文字▼

    2)上传到求字体网( www.qiuziti.com )

    3)输入被系统识别出来的单字▼

    4)得到了一个不太准确有点相似的字体名字▼

    插播一条小贴士:求字体网如果把文字识别成了几个偏旁部首,可以通过拖动合并的形式拼字▼

    至此,你得到了一个不准确但是有点相似的字体

    3、这些文字都是用了多大字号?

    1)将文字部分截图放到PPT或者 PS 里

    2)插入文本,使用相同字体,相同文字,挨个字号去试,去比对

    终于,花了10多分钟,你得到了一些不太准确且很难记的色值不怎么准确但是有点相似的字体不怎么准确但是可能相似的字号

    看你把时间都浪费在哪里了?这还没开始设计呢?你就白白花了10分钟,最后也没找到准确的字体、字号和颜色。

    能一步解决的事情就不要花1、2、3、4、5、6、7、8、9、10步

    --------看我操作--------

    1)用浏览器打开网页,点击这个Fontface Ninja的小插件▼

    2)等待2-3秒钟左右,会弹出一个小弹窗▼

    该页面使用的字体就都显示在这里了

    3)鼠标悬停在你想知道字号、颜色和字体的文字上▼

    “纽约公交死机威廉·西米洛”这段文字使用了 Ping Fang SC Regular 字体,字号大小是 24px,文字颜色色值是:#000000

    4)点击一下有更多神奇的选项▼

    如果该字体在这款插件的字体库里还可以直接点击红色框的区域去下载

    在 Type something... 的输入框里可以随便输入文字进行字体效果预览

    底部可以调整字体大小、间距、颜色去调整预览效果

    点击 Pangram 会随机生成一段文字预览

    之前10步搞定的事情,我们三步搞定了!

    那么怎么得到这个神器?

    1)打开他们的官网

    https://fontface.ninja/

    2)点击Get it now!就可以了,它会根据你使用的浏览器自动跳转到浏览器插件商店页去下载

    不过目前该插件仅支持ChromeSafari

    .........

    如果你在用的时 360 浏览器或者猎豹浏览器、搜狗浏览器等......

    装个Chrome吧,看完下面的文章你会感受到 Chrome 的强大

    油猴子脚本插件:

    让你的浏览器好用10倍的油猴子脚本大集合

    还你一个干净的百度

    赌五毛钱你的百度没我的百度快

    浏览网页时,你还在手动翻页吗?

    还你一个干净的微博和贴吧

    fatkun插件:

    老司机篇 | 收图党的春天

    我发现了一个可以批量抓取原图的秘密......

    更多插件:

    还你一个干净的百度 2.0

    这个小工具能让你的搜索效率提高100%

    有没有一款可以屏蔽所有视频广告的插件?

    这款牛逼插件,解放了我的双手!

    欢迎分享给你的设计师盆友,欢迎留言写下你常用的神器或插件!

    相关文章

      网友评论

          本文标题:设计师都应该安装这个小插件!简直是设计圈里的 One Step

          本文链接:https://www.haomeiwen.com/subject/hokqjxtx.html