如何使用clrs.cc来进行炫酷的CSS调色,相信很多没有经验的人对此束手无策,为此本文总结了问题出现的原因和解决方法,通过这篇文章希望你能解决这个问题。
创新互联公司主营辉县网站建设的网络公司,主营网站建设方案,app软件定制开发,辉县h5小程序开发搭建,辉县网站营销推广欢迎辉县等地区企业咨询
clrs.cc是最近在GitHub上发现的一个有趣的项目。它是一套精心设计的web配色方案。
web的默认的颜色看起来……比较……呃……怎么说呢……经典……
Navy #000080
Blue #0000ff
Aqua #00ffff
Teal #008080
Olive #008000
Green #008000
Lime #00ff00
Yellow #ffff00
Orange #ffa500
Red #ff0000
Maroon #800000
Fuchsia #ff00ff
Purple #800080
Silver #c0c0c0
Gray #808080
Black #000000
所以clrs.cc重搞了一套。
CSS Code复制内容到剪贴板
colors = {
# Cool Colors
aqua: "#7FDBFF",
blue: "#0074D9",
lime: "#01FF70",
navy: "#001F3F",
teal: "#39CCCC",
olive: "#3D9970",
green: "#2ECC40",
# Warm Colors
red: "#FF4136",
maroon: "#85144B",
orange: "#FF851B",
purple: "#B10DC9",
yellow: "#FFDC00",
fuchsia: "#F012BE",
# Gray Scale Colors
gray: "#aaa",
white: "#fff",
black: "#111",
silver: "#ddd"
};
提供了css文件,可以通过github获取:
代码如下:
git clone git@github.com:mrmrs/colors.git
例如,css这样使用:
CSS Code复制内容到剪贴板
如果希望使用压缩过的版本,则使用min版:
CSS Code复制内容到剪贴板
如果你希望调整颜色,可以直接修改css文件。如果需要压缩,有gulp任务提供:
代码如下:
gulp minfy
你可能惯用sass、stylus、myth,那可以直接修改git repo中的相应文件,然后用gulp生成css:
代码如下:
glup sass
代码如下:
glup stylus
代码如下:
gulp myth
项目主页
看完上述内容,你们掌握如何使用clrs.cc来进行炫酷的CSS调色的方法了吗?如果还想学到更多技能或想了解更多相关内容,欢迎关注创新互联行业资讯频道,感谢各位的阅读!