色彩怎么搭配才好看?必看的色彩搭配技巧( 三 )


观点:互补的色相搭配在一起,通过统一色调的手法,可以缓和色彩之间的对比效果 。
2.1-2 阴暗色调

色彩怎么搭配才好看?必看的色彩搭配技巧


概念应用的案例
色彩怎么搭配才好看?必看的色彩搭配技巧


阴暗的色调渲染场景氛围,通过不同色相的色彩变化丰富信息分类,降低色彩饱和度使各色块协调并融入场景,白色和明亮的青绿色作为信息载体呈现 。
Tips:多色彩经过统一色调处理,区域间非常协调,也不影响整体页面阴暗气氛表现 。
2.1-3 明亮色调
色彩怎么搭配才好看?必看的色彩搭配技巧


Kids plus的案例
色彩怎么搭配才好看?必看的色彩搭配技巧


明亮的颜色活泼清晰,热闹的气氛和醒目的卡通形像叙述着一场庆典,但铺满高纯度的色彩,过于刺激,不适宜长时间游览 。
观点:饱和度与纯度特性明显的搭配,在达到视觉冲击力的同时,可适当采用对比色或降低明度等方法调和视觉表现 。
2.1-4 深暗色调
色彩怎么搭配才好看?必看的色彩搭配技巧


LEES FERRY的案例
色彩怎么搭配才好看?必看的色彩搭配技巧


页面以深暗偏灰色调为主,不同的色彩搭配,像在叙述着不同的故事,白色文字的排版,整个页面显得厚重精致,小区域微渐变增加版面质感 。
观点:以低暗色调构成整体画面氛围,小面积明亮部分不会影响整体感觉 。
2.1-5 雅白色调
色彩怎么搭配才好看?必看的色彩搭配技巧


Very的案例
色彩怎么搭配才好看?必看的色彩搭配技巧


柔和的调子使页面显得明快温暖,就算色彩很多也不会造成视觉负重 。页面的同色调搭配,颜色作为不同模块的信息分类,不抢主体的重点,还能衬托不同类型载体的内容信息 。
观点:同色调不同色彩的模块,就算承载着不同的信息内容也能表现很和谐 。
2.2 同色调配色
这是由同一或类似色调中的色相变化构成的配色类型,与主导色调配色中的属于同类技法 。区别在于色调分布平均,没有过深或过浅的模块,色调范围更为严格 。
色彩怎么搭配才好看?必看的色彩搭配技巧


Tumblr的案例
色彩怎么搭配才好看?必看的色彩搭配技巧


在实际的设计运用中,常会用些更综合的手法,例如整体有主导色调,小范围布局会采用同色调搭配 。拿tumblr的发布模块来说,虽然页面有自己的主色调,但小模块使用同色调不同色彩的功能按钮,结合色相变化和图形表达不同的功能点,众多的按钮放在一起,由于同色调原因模块非常稳定统一 。
观点:综合运用的情况,整体界面是有主导色调,在布局例如重点图标等是同色调配色灵活运用 。
2.3 同色深浅搭配
这是由同一色相的色调差构成的配色类型,属于单一色彩配色的一种 。与主导色调配色中的同色系配色属于同类技法 。从理论上来讲,在同一色相下的色调不存在色相差异,而是通过不同的色调阶层搭配形成,可以理解为色调配色的一种 。
色彩怎么搭配才好看?必看的色彩搭配技巧


Genrecolours的案例
色彩怎么搭配才好看?必看的色彩搭配技巧


拿紫色界面来说,利用同一色相通过色调深浅对比,营造页面空间层次 。虽然色彩深浅搭配合理,但有些难以区分主次,由于是同一色相搭配,颜色的特性决定着心理感受 。

推荐阅读