服務項目

網頁配色組合

說明

由於人類肉眼有三種不同顏色的感光體,因此所見的色彩空間通常可以由三種基本色所表達,這三種顏色被稱為「三原色」。 通常我們常常見到的顏色,大多是由兩種或兩種以上的色彩所混合出來的,例如紅黃相混成橙色;黃藍相混成綠色; 紅藍相混成紫色..等。當您面對電腦螢幕在製作網頁時,顏色是經由光線折射呈現在您的眼睛上,所以適用的是色光三原色, 也就是電腦中常見的RGB,即為紅色(RED)、綠色(GREEN)及藍色(BLUE)。 WRP行銷團隊很貼心的幫管理者們,整理了關於配色相關的知識,並提供了多種的配色範本,讓管理者可以迅速地掌握配色重點, 也可以輕鬆上手網頁配色。

色彩三屬性

色彩的三屬性,包括「色相」、「明度」和「彩度」。色彩的種類非常豐富,通常可區分為"無彩色"(黑白灰) 和帶有紅、黃、綠等色彩的"有彩色"。凡是任何一個有彩色均會具備此三要素,無彩色則只有色相和明度兩個要素。
  1. 色相:指色彩的相貌或名稱,例如:「紅」、「橙」、「黃」、「綠」...等不同相貌的顏色,就有不同的名稱。
  2. 明度:指色彩明暗深淺的表現,例如:深藍色或淺藍色等。在無彩色中,高明度的色彩會比較偏向於白色,而低明亮度的色彩則偏向於黑色, 有彩色的明度顏色越淺的明度越高,顏色越深的明度越低。
  3. 彩度:指色彩的飽和度或鮮豔度,通常任何顏色的純色均為該色中彩度最高的顏色。純色一旦加入其他顏色,不論白、灰、黑或有彩色, 都會降低其彩度,加入愈多,則彩度愈低。

色調

色調的產生是將色相、明度與彩度結合在一起,色彩又分為有彩色跟無彩色,有彩色經過色相、明度和彩度的變化後,會產生不同的色彩。 藉由色調可呈現出各式各樣的色彩變化。

色相環

色彩像音樂一樣,是一種感覺。要了解色彩怎麼調和之前,可以先從了解色相環開始,在網頁設計中,較大的困難之一就是如何找出在視覺上 可以產生平衡、調和的色彩,使整個網站看起來不會太過於單調或是過於鮮豔。色相環是由伊登十二色相環由約翰斯.伊登提出, 此色相環以三原色為基礎,當作主要色相從而配製組合成十二色相環,是初學者選擇配色時最方便的參考工具。

配色原則

人眼對於顏色的對比度和亮度有超級的敏銳感,因此適合的配合組合會帶您的網頁上天堂。 無論是平面設計或是網頁設計中色彩都是最重要的一環,而配色的風格也會影響您的網頁走向, 配色就是將兩個以上的色彩配置在一起時,會產生新的視覺效果,配色又分為主色跟輔色,主色調是掌握整個畫面色彩氣氛的主要元素,而輔色面積小,負責發揮強調或緩衝調合的作用。 配色的主要目的,是用色彩來傳遞網站的形象或意向給瀏覽者,那麼進行配色時需要掌握那些原則呢?
  1. 同色系: 同一顏色, 從明度及彩度的高低求變化,每一個色系中的顏色,都有一個共同的元素,例如:暗紅色、鮮紅色、淺紅色、粉紅色等,容易達成平衡,以同色系配色是會很少失敗,穩定性也感覺較高雅。
  2. 類似色: 色相環上左右兩格的顏色稱為類似色,因色素組成相近,色彩間呈現融洽和諧的感覺。類似色配色基本原則,是將擁有共同元素的顏色搭配在一起,例如:黃色、橘黃色的共同元素是黃色,其中最大的特色就是色彩都很飽和,顏色鮮明,卻又能彼此協調。
  3. 對比色: 色相環上,取一指定顏色,則位於它120~150度的色彩就是它的對比色,對比色差異感很明顯,在配色時,可將對比色的範圍拉大,以180度對立的色彩,或是彩度的對比色、明度的對比色、甚至是寒暖色系的對比色,都可以互相搭配。對比色是差異最大的,會給人強烈的視覺印象,但很容易產生不協調的感覺,如果適當的運用調整,可以呈現非常好的色彩組合效果。
  4. 多色配色: 多種顏色配色是在製作網頁時常使用到的配色法,不過要讓多種顏色都達到協調的狀態,這就要看設計師的功力了。多色配色的方法,最好先選擇一個色彩為主色,其他顏色則做小配角,而配角顏色的選擇,以主顏色的類似色為最佳,再進行一些名度及彩度的變化調整。
  5. 有彩色及無彩色配色: 無彩色沒有太強烈的個性,所以跟甚麼顏色搭配再一起都很協調,因此很適合作為顏色與顏色之間的和事佬,去協調顏色之間的衝突感。如果兩個顏色產生排斥狀況時,若是以小面積的無彩色來區隔,那麼不協調的感覺就會消失。
立即查看配色