歡迎回到鵠學苑 — WordPress 網頁設計超詳細攻略。之前的文章中介紹過不少配色工具,但大部分都是提供使用者顏色代碼,或是提供已經搭配好的相關配色,今天要介紹的配色工具是可以讓使用者自訂主色,隨即系統在提供成功訊息、一般資訊、警告和危險訊息這四種顏色,這個顏色產生器就是 -「Eva Design System」。
Eva Design System 是什麼
Eva Design System 跟一般的配色工具不一樣的是,Eva Design System會先要求使用這自訂主色後,隨即就能算出其他四種可能其他四種功能顏色分別是成功訊息、一般資訊、警告和危險訊息顏色。並且 Eva Design System 能將主色與功能色很好的融合,不僅能條深淺,還可以鎖定特定顏色後重新眼色其他功能色,直到使用者滿意。
Eva Design System 使用教學
第一步:點擊上方網址,進入「Eva Design System」網站。
第二步:設定主色( Primary Color ) 後,系統會根據主色演算出其他四種功能色(成功訊息、一般資訊、警告和危險訊息顏色)。
第三步:如果對配色不滿意的話,可以選擇右側的重新整理鍵更改配色,若想保留色定色的話只需點選旁邊的「鎖頭」待重新整理時即會保留該項目原有的顏色。
第四步:想輸出以搭配好的色票,點選右上角「EXPORT」就能將顏色匯出!
ChatPDF 免費線上 PDF 學習神器,你不想看的文件讓AI幫你看!
https://www.design-hu.com.tw/webmaster-tools/chatpdf.html
UI Buttons 免費網頁動態按鈕素材,輕鬆踏入網頁設計CSS 的世界!
https://www.design-hu.com.tw/webmaster-tools/iconbros-elegantthemes.html
結語
對於資訊設計來說最重要的是清楚區分主色與功能色,可切換深色模式,一鍵複製 HEX 色碼或一次匯出,而 Eva Design System 不僅是顏色生產器,對於使用者來說更是很好配色學習工具!
那今天的分享就到這裡告一段落了,如果想了解最新網站知識,也可以到 鵠崙設計 官網看看,我們下次的教學見~
架站資源相關文章:
網站資訊文章推薦
通用 Google Analytics 即將停止服務,快來確認資源有沒有影響!
CTR、CPM、CPC、CPA是什麼?一次搞懂20個網路廣告用語!
行銷組合4P到4C?擬定行銷策略前必須了解的消費者觀點!