CSS Hat:让图层一键生成CSS3代码

 ,  , 

CSS hat 2 是一款PS插件,能帮助用户把图层一键转换为CSS3代码。支持Photoshop CC 2014/2015,兼容Mac、Windows平台。

$49.99 立即购买CSS Hat

 

配色、渐变、尺寸、边框……CSS即刻呈现

用CSS代码取代图像能帮前端开发人员省不少事,然而如果要呈现所有的图层样式,则需要成段成段的代码。CSS Hat能迅速把样式精确地转换成CSS代码,无需等待,帮你减轻负担!

看看CSS Hat能有多精确

一键查看图层样式

CSS Hat可以帮你一键生成填充、边框、阴影等样式组合

查看支持的图层样式

尺寸度量

不再需要选框工具来手动计算图层尺寸,CSS Hat帮你轻松度量。

支持多层(新功能)

一次选择多层,即可把每个图层都导出为单独的选择器。

 

轻松使用字体、段落样式

字体族、字重、字号……所有这些细节对排字都是至关重要的。现在,你无需一个个查看每个文字图层并手动转换成CSS,CSS Hat能自动帮你生成,即使是多个图层也不在话下!

字体样式

字体族、下划线、字重、删除线……这些CSS Hat都能办到!

段落样式(新功能)

支持一个图层中使用多种字体样式并单独导出样式规则。

Typekit结合(新功能)

你可以利用Typekit链接快速用上任意兼容字体,对于可用字体将马上得到兼容字体名及Typekit该字体链接。

 

只需轻点一下,转换Less/Sass/Stylus等语言易如反掌

使用CSS预处理器能帮你把那些繁杂的浏览器前缀抛到脑后,这也是为什么CSS Hat支持Less、Sass、Stylus的原因。你甚至还可以用你喜欢的语言创建自己的代码模板。

 

易用易读

与其哭着也要码代码,不如使用它让你拥有整齐并自动高亮的代码。实时预览功能可以方便查看浏览器效果;而有了增强拷贝功能,你可以轻松复制部分代码。

增强拷贝

你选择可以复制全部代码,也可以只复制某一尺寸或颜色

语法高亮(新功能)

语法高亮功能能让你更方便阅读CSS代码

实时预览(新功能)

选择任意图层可在浏览器中实时预览效果

官方网站:https://csshat.com/

打赏支持我整理更多优质资源,谢谢!

打赏编辑

打赏支持我整理更多优质资源,谢谢!

任选一种支付方式

1 1 收藏

资源整理者简介:凝枫

非典型性程序员,爱做一些和写程序毫不相干的事 个人主页 · 贡献了46个资源 · 1


直接登录

推荐关注

按分类快速查找

关于资源导航
  • 伯乐在线资源导航收录优秀的工具资源。内容覆盖开发、设计、产品和管理等IT互联网行业相关的领域。目前已经收录 1439 项工具资源。
    推送伯乐头条热点内容微信号:jobbole 分享干货的技术类微信号:iProgrammer