慣性聚合 高效追蹤和閱讀你感興趣的部落格、新聞、科技資訊
閱讀原文 在慣性聚合中打開

推薦訂閱源

博客园 - 司徒正美
V
V2EX
T
Tailwind CSS Blog
有赞技术团队
有赞技术团队
aimingoo的专栏
aimingoo的专栏
Apple Machine Learning Research
Apple Machine Learning Research
IT之家
IT之家
Blog — PlanetScale
Blog — PlanetScale
A
About on SuperTechFans
月光博客
月光博客
T
The Blog of Author Tim Ferriss
宝玉的分享
宝玉的分享
Martin Fowler
Martin Fowler
博客园 - 聂微东
The GitHub Blog
The GitHub Blog
V
Visual Studio Blog
WordPress大学
WordPress大学
酷 壳 – CoolShell
酷 壳 – CoolShell
Engineering at Meta
Engineering at Meta
GbyAI
GbyAI

阮一峰的网络日志

暫無文章

普通人的網頁配色方案
阮一峰 · 2019-03-16 · via 阮一峰的网络日志

普通人的網頁配色方案

網頁需要配色。一種好看、易用、符合心意的配色,是很不容易的,尤其在沒有設計師時。

一、Flat UI 色表

最簡單的方法是,從一個給定的色表選擇顏色。我以前就是這樣,主要根據 Flat UI 的色表配色。

這個色表提供20種顏色(其實是10種,每種顏色有深和淺兩個色調),對於簡單的網頁,基本夠用了。實際效果可以參考 Flat UI 官網

二、香港地鐵色表

後來,我聽說香港地鐵的每個車站,顏色都不一樣。比如,中環是紅色。

金鐘是藍色,北角是橙色。

這就是有名的香港地鐵配色,目前一共有87種顏色。

有人將這87種顏色,做成了色表,方便使用(源碼)。

我覺得,這個色表非常漂亮,符合大多數人的審美,87種顏色也足夠用了。

三、配色的經驗法則

除了使用色表,有人還提出一種配色的經驗法則,也很值得參考。

(1)網頁的主題色

深顏色使用cf69這四個字符,組合生成 RGB 色值,比如紫羅蘭色是9966ff,靛藍是6666ff,紅色是ff6666

淡顏色使用abcdef這六個字符,組合生成 RGB 色值。

(2)文字的顏色

文字最好不要使用全黑,而是使用深藍色,可以從下面幾種顏色挑。1a2a3a最深,2a3a4a次之,7a8a9a最淺。

(3)背景色、陰影色、邊框色

背景色、陰影色、邊框色都屬於襯托,建議使用灰色,可以從aaaaabbbbbbccccccdddddd這四個色值挑選。

(完)