色彩原理與色彩搭配知識點回顧總結


     好長時間沒有去關注設計領域的知識與捯飭設計軟件了,平時雖然天天也會用ps軟件,但也只是用來切切圖,做一些簡單的文字處理,根本無關設計。今天老板把公司所有的站點都點評了一遍,講出了哪里的設計不足之處,講了一些關於設計的專業的知識點,比如色彩的三要素:色相,明度,飽和度;以及設計的變化與統一的關系;黑色,白色,灰色,銀色,金色是永遠的調和色,是和事佬,百搭色。這些知識點,自己也是知道的。但由於不做設計,自己也沒有刻意去培養,鍛煉自己關於設計這方面的能力,很多東西只是一個在腦海中存在一個理論的印象,並不具有多少實踐的經驗。由於不做設計,這個理由有點不負責任與與給自己的懶惰找借口,話說不會設計的前端不是一個好程序員。作為一個前端應該是萬能的,“文能提筆安天上,武能上馬定乾坤,上的了廳堂,下得了廚房,打得過流氓。”。不僅僅是前端的那十八般武藝要樣樣精通,就能后端的那些語言,也要至少精通一門。因此既然走上了這條路,吃上了這碗飯。就好好的努力學習,不斷的進取吧。說了一大堆沒用的,下面開始正題,話說寫原創文章真是個費精力的活兒。

    

色彩的常用模式:

1.hsb模式

色相(h):顏色呈現給用戶的樣子,即色彩的種類,紅,綠,藍是屬於三種不同色相的顏色。

飽和度(s):也叫純度,顏色的濃度。這個顏色偏淡了,這個顏色太濃了。往一個顏色值里面不斷加灰色,這個顏色值的純度就會降低,加它的互補色,它的純度也會降低。

明度(b):描述顏色的明暗度。這個顏色是亮了還是暗了。往一個顏色里面不斷加黑,這個顏色的明度就越來越低了,不斷加白,這個顏色的明度就越來越高。

2.rgb加色模式

rgb是一種發光的色彩模式,他通過rgb三原色的相互疊加,可以生成各種其他不同的顏色,我們稱其為加色模式。

可以把它看做是一個發光的燈泡,燈泡有255個檔次,0的時候發光最弱,0,0,0的時候光線最暗,就是黑色。255的時候發光最大,255,255,255的時候光線最強就變成了白色。

其他的情況介於0-255之間,一共有255*255*255=16777216種不同的情況,因此也叫做1600萬色,也稱為24位色(2的24次方);

在ps的通道里面,用紅綠藍三條通道記錄圖像的顏色信息,紅通道越白,說明紅色越多,越黑說明紅色越少,其他通道也是一樣。

對於rgb加色模式的解釋:

什么叫加色模式呢,舉個例子好了,我們通常使用的電視屏幕和電腦屏幕上的顯示就是這樣的模式,在沒有圖象時,屏幕是黑的,若R,G,B三色亮度都為255時混合疊加打在屏幕上時則顯示成白色。就是加起來變成白色,叫加色模式。

3.cmyk減色模式

cmyk是一種用來印刷的色彩模式,自己不會發光,需要光源照射。

在ps中也存在四種通道模式來記錄顏色信息,但是跟rgb的情況是相反的,通道白色越多代表油墨越少,越黑代表油墨越多。

 

對於cmyk的減色模式解釋:

解釋一:可以理解為所有cmyk模式的物體其實沒有顏色,在沒有任何其他光源的情況下他們都一樣不可見,他們的顏色其實是他們吸收太陽光能力的表現,是被不同程度上消減的太陽光本身,如果一個顏料表現為紅色,那是因為它吸收了太陽光組成中的所有其他部分,唯獨留下了紅色光,這個過程看起來確實是一個減法。。。(來自網友)。

解釋二:什么叫減色模式呢。因為印刷是印在紙上的,紙一般都是白色的,有油墨塗上去才顯示顏色,當C、M、Y三種顏色油墨完全混合則產生了黑色,因此,減去顏色才是白色嘛,所以叫減色模式。(這個解釋很有道理),cmyk模式 青色,洋紅,黃色,每疊加一次就減少本身顏色的反射光,三種疊加后,把人眼所識別的顏色的反射光 減到最小了,所以沒有反射光了 我們就看到了黑色!實際不是純黑色!所以是減色模式,加和減都是相對於人眼識別的顏色,RGB的疊加是不斷增強人眼識別顏色的反射光,CMYK是不斷減少人眼識別顏色的反射光,所以加色模式變亮,減色模式變暗。

解釋三:

為什么叫減色模式呢?比如,我們在電腦屏幕上看到一朵紅色的花,這個紅色的光波就是來源於屏幕,是屏幕本身發出了特定的波長的光直接進入眼睛(至於屏幕的發光機制是電子射線還是液晶折射我們就不討論了)。而我們在白天看到現實中的紅花,這個紅色光波卻是來自太陽,太陽光(太陽光是七種色光混合而成的白光)射到花上,只有紅色波長的光被反射出來(其他波長的色光都被花吸收了)。所以此時我們看到的紅色,是七色光被減去了非紅色部分而遺留下來的。事實上在有外界光的環境中,我們看到的任何不發光體的顏色都是由外界光減去被吸收的光而遺留(反射)的部分。所謂的減色模式中的“減”就是指從光源中減去的意思。在理論的環境中,甚至會產生一些我們很難想象的效果。例如,假設我們處在一個真空的沒有光線的房間里,你面前有一朵紅花。如果不開燈我們根本看不到這朵花。但是,如果有一束藍色的光直接照到花上面,我們能看到這朵花嗎?如果看到了又會是什么顏色呢?理論上,我們仍然會是看不見這朵花,而且如果可以看見一點也絕不可能是紅色,而是藍色。因為紅花會吸收藍色的光波,既便沒有完全吸收而漏了一點,反射出來的波長仍然是藍色的部分。整個房間里根本就沒有紅色波長的光源,無論如何是不會看到紅色的。對於所有的不發光體,它所呈現的顏色都是減色模式下所形成的。顯然印刷品是不發光體,所以其采用的CMYK模式自然也就是減色的模式了。


加色與減色模式在PS中的應用:
正片疊底是減色模式,
圖像會越來越暗,最后變成黑色,所以如果用畫筆直接畫白色,是畫不上去的,即不能用白色覆蓋圖層現有顏色所以我們得出結論減色模式屏蔽白色,因為白色是減色模式的初始顏色。
濾色是加色模式,圖像會越來越亮,最后變成白色,所以如果用畫筆直接畫黑色,是畫不上去的,即不能用黑色來覆蓋圖層現有顏色,所以我們得出結論,在加色模式屏蔽黑色,因為黑色是加色模式的初始顏色。

關於對rgb加色模式與cmyk的減色的模式的解釋請看這篇文章:http://blog.sina.com.cn/s/blog_5054fad20100cyvf.html

 關於顏色模式的深刻理解請查看這篇文章:http://vod.sjtu.edu.cn/help/Article_Print.asp?ArticleID=514

加減色模式參考文章:https://www.zhihu.com/question/22839343

色彩的搭配方法:

圖一:

圖二:

圖三:

圖六:

圖四:(圖片是百度的質量比較差。但能夠直觀的說明問題。)

1.同色系搭配法

同色系,在色相環里面夾角為0度,屬於同一個色相的不同明度的以及飽和度的相同色系的顏色搭配法。

2.鄰近色搭配法

鄰近色,指的是在色相環里面與自己夾角為30度的兩種顏色

3.類似色搭配法

類似色是指在色相環里面夾角與自己夾角為60度的兩種顏色

4.中度色搭配法

中度色是指的在色相環里面與自己夾角為90度的兩種顏色。

5.對比色搭配法

對比色是在色相環里面與自己夾角為120的兩種顏色。

6.互補色搭配法

互補色:在色相環中夾角為180度的兩個顏色。也稱為反轉色,互補色是一種此消彼長的關系,

具體的顏色搭配方法,請查看下文:

http://www.uisdc.com/3-color-matching-skills

7.通過從自然拍攝的照片中取色來定義網站的色調方案  參考文章:http://www.uisdc.com/create-color-swatches-from-photograph

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2026 CODEPRJ.COM