配色方案，使用LESS color函数创建配色方案

前言：用LESS CSS框架进行编码会简化代码结构，提高我们的工作效率，但是试验后你会发现，默认情况下，LESS在Firefox中能被正确编译，实现效果，但IE和Chrome是无法解析LESS代码的，必须对浏览器进行一些设置才行。如果希望对LESS有一个最基础的了解，IBM 对LESS CSS框架的简介会帮到你http://www.ibm.com/developerworks/cn/web/1207_zhaoch_lesscss/

 

使用LESS color函数创建配色方案

 

LESS提供了一些函数，使定义和操作颜色变得超级简单。在本教程中，我们将使用其中的一些函数帮助你控制颜色，更好地配色并保持其组织性。

 

色轮

首先是spin()函数，它可以让我们在色轮上指定一种颜色。这个函数是非常有用的，比如说，在进行配色的时候。你可能已经看过一些常见的颜色结构，以一种和谐的方式进行组合，比如说互补色，三元色，混合色。使用一些工具，像Adobe Color CC(原名Kuler)，你可以遵循这些结构快速的生成配色方案。但是如何使用LESS制定我们自己的配色方案呢？

 

互补色

我们将以生成最简单地色彩结构——互补色开始。这种互补的颜色正好在色轮相反的位置。

 

首先，我们定义一种基准色，然后参照基准色定义第二种颜色。挑选一种你最喜欢的，或者是任意一种突然浮现在你脑海里的颜色。这里我们挑选了一种青蓝色，#3bafdA，作为实例：

由于想要在色轮上得到基准色的补色，我们将度数值设为180。

 

 

 

这让我们得到两个精确、可爱的颜色，它们是互补的。

以下是将这些颜色应用到网页原型设计中的一个例子：

三元色

我们可以进一步探讨颜色模型并且创建一个三元色结构。“三元”，顾名思义，是由三种颜色组成。因此，我们将色轮分成三部分，并且用函数spin()来设置旋转的度数：