超好用的網頁配色網站

學習網頁的過程中, 配色一直是個傷腦筋的問題,
畢竟對色彩會牽動著訪客對網頁的第一印象, 
色彩有著它的獨特性, 選擇合乎主題的主色調, 貫穿所有頁面, 能快速構成深刻印象
在開始設計前, 我們需對網站屬性或目標對象挑選色彩組合,
下面這個網頁可以提供我們參考值, 這是配色分類字典, 
提供了很多主題配色的方案, 我們可依不同需求選擇的顏色表現 
 

EX: 優雅的-顯示優雅單一以及2色, 3色的搭配方式
一個網頁配色基本上有
一.  主色 - 企業色, 以營業項目類別為主
網頁中面積最大的色彩為畫面的主色調,網站中所有的頁面,
出現次數最多的就是主色調。
二. 輔色
主色調是掌握整個畫面色彩氣氛的主要元素,而輔色面積小,負責緩衝調合的作用,
三. 強調色,是空間中動感和活力的來源,還可以因其色彩「點」的作用,使主色協調整個畫面得以連貫,這種一般為醒目突出的色彩。
另外可再加上基色-黑、白 和介質色 - 灰 
網頁背景色設計
背景色彩或底色的設計,是突出主體的重要手段。
要把網頁作的「亮」一些, 並不是白底就可完成, 白色是明亮的色彩,但是白本身並不具有「亮」的作用,可是黑底上的白色則非常醒目。
網頁的感覺,亮一些應該使底色與主體色調在色相、明度、飽合度的對比大一些,
如果主體色調的鮮豔明快,底色通常用中低明度和飽合度較沉靜的色彩,以利於襯托主體。
再來介紹幾個好用的配色網站
它也支援photoshop 的色票, 
1. 單色配色-版面由單一顏色漸變方式而成
2. 相近色-沈穏,帶給人舒適自然感受, 是最常被使用的方式
   3色 , 4色- 活潑
2. 選取需要色, 及輔色型態
   2.1 輸入主色(企業色)
   2.2 選擇輔色型態
   2.3 系統產生 my palette
   2.4  預覽配色網頁
        1. PREVIEW - 預視配色結果
         2. EXAMPLE - 套入範例中預視
            positive design , negative design 可切換
     
       3. COLOR TABLE 可存成色票, 在PS中載入
          點入 color table -> 可存成 html, css...
           
          點擊 Color swatches -> as ACO (可由photoshop 載入)
          
          點擊後會自動下載 mypalette.aco
         
3. 回到 photoshop
   色票面板 -> 點擊右上的隠藏選單 -> 載入色票(或取代色票)
     
   即可載入下載的 mypalette
   
  此時可載入我們設定的配色組合
   

 
它是依網頁安全色所製作的調色盤,
點選左方所需顏色, 對應色會新增到右側版面,找出令人滿意的組合
搭配不同顏色的組合,
  這網站可以幫我們找到需要的顏色
  images 我們可上傳圖片, 抓取我們喜歡顏色!
它可將圖面分析出不同的色票, 
 
search : 輸入一個物品名稱(例如 sky)就能產生相關顏色
這也是個常用的配色網站, 提供您參考!!
另外,剛剛看到的色胚子這個免費軟體, 應該也是不錯用的好工具!
有興趣的朋友可以參考 http://sofun.tw/colorbase/
搜尋 色胚子下載 也可以找到很多載點哦! 我還沒好好使用, 就不多做介紹了!
對不是美工底的朋友, 配色真是讓人頭大,
但藉由軟體幫忙, 可以讓自己累積能量, 慢慢不再頭大哦!
繼續加油吧!

0 意見:

張貼留言