极具“杀伤力”的网页调色板

原创 2004年07月27日 15:35:00

在web站点设计中,对网页进行配色通常是设计师的直觉感受或者多次反复实验:例如对网页颜色主色彩的选择,考虑各种颜色的色调、饱和度,等等...,最终才能达到比较好的配色效果。
现在,网络上有一些专用于配色设计的调色板工具,对网页配色设计都很有价值。
个人觉得,比较好用、非常专业、同时对于网页设计师(更专注于网页配色)非常有帮助的一个在线免费工具 - 我很惊叹这是用Javascript写的:)
http://www.pixy.cz/apps/barvy/index-en.html

 

简要说明使用方法:
1. 选择基色
在配色前,你需要在左侧的调色板中先选择一个基色(Base color),选择基色也很有讲究,调色

版为我们划分了暖色(warm)和冷色(cold)两种色调,并依此进行了更精确的数值区分(直接对基色

微调按钮进行操作)。

2. 选择配色方案
在Scheme的选择菜单中可以选择多种方案进行配色,具体有:单色配色、对比色配色(基色加补色

)、可调整的对比色配色(可以调整Distance参数对补色进行微调)、双对比色(两个比较接近的

颜色及它们所对应的补色)、类似色(基色和它相接近的颜色)。

a. 单色配色方案(monochromatic):如果整个网页配色由一些单一颜色渐变组成,这个方案是不错

的选择。

b. 对比色配色(contrast):原理是为基色增加与其色差比较大的几种对比色。如果整个网页的色

彩反差比较大,并且形成反差的颜色数量不是很多,推荐用这种方案。

c. 可调整的对比色配色(soft contrast):参照b方案,可以进一步调整各对比色与基色的色差

,方法是调节Distance参数。

d. 双对比色(double contrast):两个比较接近的颜色及它们所对应的对比色(4个一组),为

基色增加一个相近颜色,同时调节出这两种颜色的对比色,如果将Distance调节至0,将只看到2个

一组的对比色,随着Distance的增加,会逐渐显现4个一组 - 两对对比色。

e. 类似色(analogic):与基色比较接近的各种颜色,推荐色彩比较柔和、反差不明显的网页使用

3.自定义基色的色调(Hue)、饱和度(Saturation)、亮度(Brightness)

对这些选项进行微调后,所配置的方案颜色会起到相应变化。

4.在最底部的select选择器中,你可以特别地为色盲设计的相应的配色方案.

5.选择WebColors后,使配出的颜色更符合网页用色!

6.除此之外,点击free editor按钮,进行自由配色。

接着,我再推荐一些调色版的相关链接,有兴趣的朋友可仔细琢磨一下:
http://www.colormatch.dk/
http://slayeroffice.com/tools/color_palette/
http://kohaistyle.com/scripts/quickcolor http://www.easyrgb.com/harmonies.php
http://www.stcsig.org/usability/topics/colorblind.html
http://color.twysted.net
http://www.coolhomepages.com/cda/color
http://www.masternewmedia.org/2003/04/30/

how_to_select_perfectly_matching_color_combinations.htm
http://dev.sessions.edu/ilu/ilu_1.html http://www.technetguru.com/design
http://www.mundidesign.com/webct
http://graphicdesign.about.com/library/color/blweb2.htm
http://www.pourpre.com/chromograf/en/
http://www.webwhirlers.com/colors/wizard.asp

最后, 如果你觉得我推荐的调色板好用或者还不错的话,请不要忘记在注释中评论。

BMP位图与调色板分析

调色板(color table)是单色、16色和256色图像文件所特有的,相对应的调色板大小是2、16和256,调色板以4字节为单位,每4个字节存放一个颜色值,图像的数据是指向调色板的索引。  ...
  • szlcw1
  • szlcw1
  • 2013年11月22日 21:37
  • 1037

调色板的原理和调色板显示模式

调色板只有图片的颜色小于等于256色的时候才有,16位高彩和24位32位真彩是没有调色板的.                                                      ...
  • qq_26093511
  • qq_26093511
  • 2016年04月03日 19:04
  • 864

图像处理(二十三)基于调色板的图像Recoloring-Siggraph 2015

1、自动调色板颜色选择算法 这一部分,paper的创新点在如何对图像像素点进行快速聚类? 通过一种改进的k均值算法,进行聚类,paper默认选择k值为5,每个聚类中心颜色就是调色板颜色Ci。这个就像g...
  • hjimce
  • hjimce
  • 2015年10月18日 11:01
  • 3283

Windows 调色板

目 录 第1章 调色板    1 1.1 为什么要使用调色板    1 1.2 使用调色板    2 1.2.1 创建逻辑调色板    2 ...
  • Hanford
  • Hanford
  • 2016年12月12日 14:41
  • 409

bmp图像的调色板

调色板(colortable)是单色、16色和256色图像文件所特有的,相对应的调色板大小是2、16和256,调色板以4字节为单位,每4个字节存放一个颜色值,图像的数据是指向调色板的索引。     ...
  • L1259863243
  • L1259863243
  • 2016年08月23日 15:00
  • 1503

关于位图中【调色板】、DDB、DIB的概念

一、调色板 1.我们知道,自然界中的所有颜色都可以由红、绿、蓝(R,G,B)三基色组合而成。而计算机对于像素的处理,用一个字节,将每种基色分为了256种等级,那么红、绿、蓝的不同组合共有256*25...
  • foreverhuylee
  • foreverhuylee
  • 2014年04月02日 17:28
  • 1250

Android 仿PhotoShop调色板应用(一)概述

在前面的系列我已经将Android中颜色渲染的原理及使用做了一个整体上概述. 现在开始根据一个比较复杂的实现进行具体的分析,这就是PhotoShop中的调色板应用 这个实现要比API Dem...
  • t12x3456
  • t12x3456
  • 2013年09月11日 08:59
  • 8712

PAL文件(Palette,调色板)及格式

.PAL文件指的是Palette(调色板)文件,通常有两种格式:一是Microsoft(微软) PAL 文件,二进制格式用于PhotoShop 和 Paintshop Pro;一是JASC PAL文件...
  • dou3516
  • dou3516
  • 2016年11月20日 16:39
  • 1046

【Qt5开发及实例】11、QPalette调色板使用

我做的这个不知道为什么有两个功能无法显示,也没有报错,我暂时是想不出什么好办法= = 实现目标 palette.h /** * 书本:【Qt5开发及实例】 * 功能:实现调色板的...
  • cutter_point
  • cutter_point
  • 2015年01月03日 13:54
  • 1512

BMP位图调色板

原文地址:http://blog.csdn.net/qsycn/article/details/7801145 BMP位图调色板是BMP位图文件的组成成分之一,调色板是单色(调色板中含有两种颜色,也就...
  • kkkkkkkkq
  • kkkkkkkkq
  • 2016年12月26日 20:11
  • 622
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:极具“杀伤力”的网页调色板
举报原因:
原因补充:

(最多只允许输入30个字)