`
HuNanPengdake
  • 浏览: 236289 次
  • 性别: Icon_minigender_1
  • 来自: 广州
社区版块
存档分类
最新评论

网页设计配色基础:RGB与HSB

阅读更多
在实用美术中,常有"远看色彩近看花,先看颜色后看花,七分颜色三分花"的说法。
  这也就说明,在任何设计中,色彩对视觉的刺激起到第一信息传达的作用。因此,对色彩的基础知识的良好掌控,在网页设计中才能做到游刃有余。

  为了使下面的网页配色分析更易于理解,我们先来了解色彩的RGB模式和HSB模式。


  ■ RGB

  RGB是表示红色绿色蓝色又称为三原色光,英文为R(Red)、G(Green)、B(Blue),在电脑中,RGB的所谓"多少"就是指亮度,并使用整数来表示。
  通常情况下,RGB各有256级亮度,用数字表示为从0、1、2至255。虽然数字最高是255,但0也是数值之一,因此共256级。按照计算,256级的RGB色彩总共能组合出约1678万种色彩,即256×256×256=16777216。通常也被简称为1600万色或千万色。也称为24位色(2的24次方)。
  对于单独的R或G或B而言,当数值为0时,代表这种颜色不发光;如果为255,则该颜色为最高亮度。因此当RGB三种色光都发到最强的亮度,纯白的RGB值就为255,255,255。屏幕上黑的RGB值是0,0,0。R,意味着只有红色存在,且亮度最强,G和B都不发光。因此最红色的数值是255,0,0。同理,最绿色就是0,255,0;而最蓝色就是0,0,255。黄色较特殊,是由红色加绿色而得就是255,255,0。


纯白色数值为R255,G255,B255纯黑色数值为R0,G0,B0
红色数值为R255,G0,B0绿色数值为R0,G255,B0
蓝色数值为R0,G0,B255黄色数值为R255,G255,B0


RGB模式是显示器的物理色彩模式。这就意味着无论在软件中使用何种色彩模式,只要是在显示器上显示的,图像最终就是以RGB方式出现。

■ HSB
  是颜色分为色相、饱和度、明度三个因素。英文为H(Hue)、S(Saturation)B(Brightness)饱和度高色彩较艳丽。饱和度低色彩就接近灰色。亮度高色彩明亮,亮度低色彩暗淡,亮度最高得到纯白,最低得到纯黑。一般浅色的饱和度较低,亮度较高,而深色的饱和度高而亮度低。
分享到:
评论

相关推荐

    网页设计配色基础.doc

    网页设计中的配色基础是决定一个网站视觉效果的关键因素。色彩能够快速吸引用户的注意力,有效传达信息,甚至影响用户的情绪和浏览体验。本文主要介绍了两种色彩模式:RGB和HSB。 RGB模式是基于红(Red)、绿(Green)...

    网页设计配色黄金方案

    在探讨网页设计中的配色方案之前,我们首先需要理解色彩的基础知识,特别是色彩模型中的RGB与HSB模式。 ##### 色彩基础知识 在设计领域,有一句广为人知的话:“远看色彩近看花,先看颜色后看花,七分颜色三分花。...

    网页设计配色.doc

    总结来说,掌握RGB和HSB色彩模式是网页设计师必备的基础技能。通过灵活运用这两种模式,设计师可以创造出既美观又符合用户体验的网页设计,从而提升网站的整体质量和吸引力。无论是选择鲜明的色彩来激发用户情绪,...

    网页配色方案

    - **颜色三原色**:红、绿、蓝,也称为RGB颜色模型,是网页设计中常用的颜色系统。 - **色彩模式**:包括RGB、CMYK、HSB(色相、饱和度、亮度)等,理解这些模式有助于选择合适的颜色组合。 - **色彩的相互关系**...

    网页配色手册

    综上所述,《网页配色手册》涵盖了从基础理论到实践技巧的全方位配色知识,对于提升网页设计师的配色能力具有极高的指导价值。通过深入学习并运用这些知识点,设计师可以创作出更具吸引力和友好的网页界面。

    网页设计配色工具包_v2_iRuif.cn.rar

    网页设计配色是创建引人入胜且具有良好用户体验的关键元素之一。"网页设计配色工具包_v2_iRuif.cn.rar" 是一个专门针对网页设计师的资源集合,它包含了一系列实用工具,帮助设计师轻松地进行色彩搭配和选择。这个...

    平面设计-看图学配色-配色教程

    配色的基础建立在色彩理论之上,主要包括色彩的分类(原色、二次色、三次色)、色彩模型(RGB、CMYK、HSB等)以及色彩的关系(补色、类似色、三文鱼色、分裂补色)。理解这些基本概念对于构建和谐的色彩组合至关重要...

    TakeColor网页配色工具

    网页配色是设计领域中的一个重要环节,特别是在网页设计中,合适的色彩搭配能够直接影响用户的视觉体验和网站的整体风格。"TakeColor网页配色工具"是一款专为网页设计师和开发者设计的实用工具,它提供了丰富的配色...

    报表开发小技巧:报表的设计与配色技巧

    为此,文中提出了一系列关于报表设计与配色的技巧,下面将对这些技巧进行详细解读。 首先,关于报表设计工具的使用。文中提到了报表开发工具FineReport,这是一个专门用于报表开发的工具,它支持快速报表开发、数据...

    网页配色软件 2.0

    6. **兼容性**:考虑到前端开发的需求,该软件可能支持与常见网页设计工具如 Sketch、Adobe Photoshop 和 Illustrator 的集成,方便在多平台间无缝切换。 7. **教程与资源**:软件可能提供色彩设计的教程和灵感来源...

    HTML教程电子书 网页配色电子书

    HTML教程电子书与网页配色电子书是两个重要的学习资源,它们涵盖了网页设计与开发的基础知识。HTML(HyperText Markup Language)是构建网页内容的基本语言,而网页配色则是提升用户体验和视觉效果的关键。 HTML...

    Flash网页配色软件

    "Flash网页配色软件"是一款专为网页设计师打造的工具,它能够帮助用户在创建网站时轻松选择和搭配颜色,以达到视觉上的和谐与吸引力。这款软件结合了艺术与科技,使得非专业设计人员也能进行专业级别的配色工作。 ...

    colorschemer studio 网页配色器

    它还可以生成CSS代码,方便网页设计师直接应用于网站设计,实现设计与前端开发的无缝对接。 在压缩包中,"colorschemer studio 网页配色器"可能是软件的安装文件或便携版程序,用户只需按照指示进行安装或运行,...

    网页配色辞典

    网页配色是设计领域中的一个重要环节,特别是在网页设计中,合适的色彩搭配能够有效提升用户体验,增强网站的视觉吸引力。《网页配色辞典》是一部专为网页设计师和开发者准备的资源,它通过图片和网页形式展示了各种...

    网站配色宝典(网站设计)

    网站配色是网页设计中的关键元素之一,它不仅影响着用户的第一印象,还对用户体验、品牌识别度以及信息传达效率有着深远的影响。《网站配色宝典》可能是一本深入探讨这一主题的专业书籍,旨在帮助建站者和设计师掌握...

    小白学习PS时常用配色对照表

    "常用配色表"通常会列出这些配色方案的具体颜色值,比如RGB、CMYK或者HSB模式下的数值,方便设计师直接在PS中调用。此外,它可能还会包含不同情境、主题和情感对应的推荐配色,如商业设计中的专业色调、节日设计中的...

    网页设计小工具-拾色器

    网页设计是将创意与技术相结合的艺术,色彩作为视觉传达的重要元素,对于网页的美观和用户体验起着至关重要的作用。"网页设计小工具-拾色器"便是为了帮助设计师们更高效地选取和应用颜色而设计的实用工具。这款工具...

Global site tag (gtag.js) - Google Analytics