当前位置:首页 > PS教程 > PS教程

配色技巧,给初学者的6条网页设计安全配色指南

  • 2022-12-24 20:51:59
  • 来源/作者:互联网/佚名
  • 己被围观

分享六条心得。你可以遵循“不会错”指南基本掌握色彩在网页设计中的运用。这些不是规则,你可以在你的职业生涯中创建更多的配色方案,使它往完全不同的方向发展。

4. 如果有疑问,使用蓝色

如果你对选择什么强调色有任何疑问,请使用蓝色。蓝色通常是最灵活的颜色,适合多数的网站类型。紫色和黄色之类的颜色可以是很活泼的,但是如果使用不当的话,立马会变得很花哨。

另一方面,你可以在以蓝色为强调色的基础上随意发挥,但你也不能走的太远。如果你不知道从哪里开始学习或者在项目中使用什么颜色的时候,就用蓝色就对了。如果你要选择特别的蓝色,你可以选择深蓝色(H值235)至浅绿色(H值190)的范围以保证自己在安全的领地。

 

配色技巧,给初学者的6条网页设计安全配色指南

 

在我的布局示例中,我选择值为205的色相。当你已经选定了强调色,将它添加到任何你认为必需的位置。假如你在按钮或任何其他有文字的区域使用了强调色,也要相应地改变文本的颜色。在这个例子中,我将强调色区域之上的文字改成了白色。

 

配色技巧,给初学者的6条网页设计安全配色指南

 

5. 为强调色添加变化

一旦你选定了强调色,将色相(H)滑条位置保持不变。你现在需要为你的设计添加额外的颜色,不过为了让事情变得更简单,这些颜色都是你已经选择的强调色的变色。

在颜色选择器上强调色周围拖动选色点来创建变色。

 

配色技巧,给初学者的6条网页设计安全配色指南

 

在以下这些元素上使用变色:

悬停效果

 

配色技巧,给初学者的6条网页设计安全配色指南

 

边框

 

配色技巧,给初学者的6条网页设计安全配色指南

 

强调色上的文本

 

配色技巧,给初学者的6条网页设计安全配色指南

 

渐变

 

配色技巧,给初学者的6条网页设计安全配色指南

 

光和阴影的效果

 

配色技巧,给初学者的6条网页设计安全配色指南

 

6. 避开调色面板右上角的位置

颜色选择器上右上角的位置是高纯度的颜色。右上角的颜色像一级方程式赛车,它们的执行力惊人,并且非常吸引人,但是我们一般需要足够的经验才能很好地驾驭它们。如果没有经验的话,它们可能会造成事故,所以最好去尝试使用更缓和的颜色。

这就是为什么我在本教程的第三节让你选择右上角四分之一中心位置的颜色,以确保以一种相对柔和的颜色开始。

为了说明这一点,看一下假如我只改变设计的色相,不再动颜色选择器,会是什么效果。

 

配色技巧,给初学者的6条网页设计安全配色指南

 

它仍然看起来非常漂亮,对吧?但是如果我把选色点拖拽到颜色选择器的右上角,它突然就变得不太好了。

 

*PSjia.COM 倾力出品,转载请注明来自PS家园网(www.psjia.com)

更多精彩内容

  • 工具运用,给产品图片加上尺寸标识 工具运用,给产品图片加上尺寸标识
  • ps大师之路:ps笔刷的详细设置 ps大师之路:ps笔刷的详细设置
  • ps无缝重复图案的制作和使用方法 ps无缝重复图案的制作和使用方法
  • photoshop大师之路消除锯齿和羽化 photoshop大师之路消除锯齿和羽化
  • 教你怎样分辨照片是否被ps过 教你怎样分辨照片是否被ps过
  • 浅谈photoshop图像处理中的亮调,中间调,暗调选取 浅谈photoshop图像处理中的亮调,中间调,暗调选取
  • Photoshop自由变形调整照片的透视变形 Photoshop自由变形调整照片的透视变形
  • 文字设计,英文字母组合的N种方式 文字设计,英文字母组合的N种方式