跳至內容

維基百科:格式手冊/無障礙/顏色表

本頁使用了標題或全文手工轉換
維基百科,自由的百科全書

本頁中的顏色表旨在幫助編輯者挑選符合無障礙條件的背景配色。第一表展示14種色相和灰色的WCAG AAA等級配色。每行中的「基礎顏色」是該色相最簡單的顏色,而其他顏色則由基礎顏色的HSL明度變化而來,以達到WCAG所需的對比度

編輯者應確保背景顏色與一般文字和藍色連結的對比度足夠高,因為這兩種是大多數條目最常出現的顏色。您可以通過WCAG連結對比度檢查器確定所選的背景顏色與一般文字(#202122)和藍色連結(Vector 2022外觀:#3366CC)的對比度能達到WCAG AA等級的要求。[1]

如果頁面沒有連結和參考,則您可以將文字顏色設為純黑色(#000000),提高對比度。深色背景需要使用白色文字(#FFFFFF)比照。

各基礎顏色的AAA等級背景顏色(與文字和連結對比)
基礎顏色 深色文字的最深色背景 白色文字的最淺色背景
名稱 色相 十六進制 顏色 文字和連結
(WCAG AA)
僅限文字 純黑文字
(非預設)
紅色 FF0000 FFE6E6 FF8888 FF6060 B60000
橙色 30° FF8000 FFE8D0 FF8E1C E97500 8C4600
黃色 60° FFFF00 F3F300 B1B100 9B9B00 5C5C00
黃綠 90° 80FF00 B9FF72 61C100 54A900 326500
綠色 120° 00FF00 ABFFAB 00C700 00AE00 006800
春綠 150° 00FF80 9DFFCE 00C563 #00AC56 006733
青色 180° 00FFFF 7DFFFF 00BFBF 00A6A6 006363
天藍 210° 0080FF DCEEFF 60B0FF 3098FF 0057AF
藍色 240° 0000FF EAEAFF A2A2FF 8888FF 3030FF
紫色 270° 8000FF F3E7FF C994FF B974FF 7600EC
品紅 300° FF00FF FFE3FF FF73FF FF29FF 9F009F
玫瑰 330° FF0080 FFE4F1 FF81C0 FF52A8 B00058
灰色 808080 EBEBEB ABABAB 959595 595959

網頁顏色

網頁顏色名稱

自2005年以來,所有主要瀏覽器都支援以下網頁顏色

與文字和藍色連結對比時皆達到WCAG AA等級:

  • White
  • Ivory
  • MintCream
  • Azure
  • Snow
  • Honeydew
  • FloralWhite
  • GhostWhite
  • AliceBlue
  • Seashell
  • OldLace
  • WhiteSmoke
  • LavenderBlush
  • Beige
  • Linen
  • AntiqueWhite
  • LightYellow
  • LemonChiffon
  • LightGoldenrodYellow
  • PapayaWhip
  • Cornsilk
  • BlanchedAlmond
  • LightCyan
  • Yellow


與白色文字對比時達到WCAG AAA等級:

  • Black
  • DarkSlateGray
  • Navy
  • DarkBlue
  • MidnightBlue
  • MediumBlue
  • Blue
  • Indigo
  • Purple
  • DarkSlateBlue
  • DarkMagenta
  • DarkRed
  • Maroon
  • SaddleBrown
  • Brown
  • DarkGreen

與白色文字對比時達到WCAG AA等級:

  • DimGray
  • MediumVioletRed
  • Firebrick
  • Crimson
  • DarkOliveGreen
  • Green
  • Teal

網頁顏色簡寫

以下網頁顏色很多都是表格儲存格模板的背景顏色,特別是黃-綠-青範圍的顏色。有些模板使用藍-粉-紅範圍的顏色時,會選用稍微更深的顏色,加強色度

與未訪問連結對比時達到WCAG AAA等級的顏色
FEF FFE EFD EFE DFE EFF
FFD CFE DFF
FFC EFC DFC DFD BFE CFF
FFB EFB DFB CFB CFC CFD BFF
FFA EFA DFA CFA BFD AFF
FEE FF9 EF9 DF9 CF9 BFB BFC 9FF
FED FF8 EF8 DF8 CF8 AFC
FEC FF7 EF7 DF7 CF7
FEB FF6 EF6 DF6 CF6
FEA FF5 EF5 DF5 CF5
FE9 FF4 EF4 DF4 CF4
FE8 FF3 EF3 DF3 CF3 BFA AFD
FE7 FF2 EF2 DF2 CF2 BF9 AFE
FE6 FF1 EF1 DF1 CF1 BF8 9FE
FE5 FF0 EF0 DF0 CF0 BF7 9FD 8FF
EEC EED EEE EEF DEF

參見

參考文獻

  1. ^ WCAG 2.0 and Link Colors. WebAIM Blog. WebAIM. 22 July 2009.