|
这篇文章主要介绍了使用clrs.cc来进行炫酷的CSS调色,同时也介绍了使用gulp来配合CSS框架的方法,需要的朋友可以参考下
clrs.cc是最近在GitHub上发现的一个有趣的项目。它是一套精心设计的web配色方案。
2015721165504398.jpg
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复制内容到剪贴板
- <link rel="stylesheet" href="css/colors.css">
如果希望使用压缩过的版本，则使用min版：
CSS Code复制内容到剪贴板
- <link rel="stylesheet" href="css/colors.min.css">
如果你希望调整颜色，可以直接修改css文件。如果需要压缩，有gulp任务提供：
复制代码代码如下:gulp minfy
你可能惯用sass、stylus、myth，那可以直接修改git repo中的相应文件，然后用gulp生成css：
复制代码代码如下:glup sass
复制代码代码如下:glup stylus
复制代码代码如下:gulp myth
项目主页
| 
发表于 2015-7-21 16:51:09
