創建於 07/22/2025 11:50
Accessible Contrast-First Vue Components
- ADA Aqua#00acc1
- Standard Black#000000
- Banner Light#f5f5f5
- Headline Amber#ffc107
- Link Purple#7e57c2
- Modal White#ffffff
- Form Label Gray#757575
調色盤由 光, 黑暗的 種顏色組成. 強調色 ADA Aqua #00acc1 和 Headline Amber #ffc107. 調色盤有 涼爽的, 中性的, 溫暖的 色溫.
依亮度,此調色盤由 #000000(最深)到 #FFFFFF(最淺)。 亮度範圍較寬。
整體飽和度多半偏柔(彩度較低)。
色相在色輪上分佈較廣——較多元的調色盤(啟發式)。
多數色票讀起來偏中性色溫。
HEX 代碼(排序):#000000, #00ACC1, #757575, #7E57C2, #F5F5F5, #FFC107, #FFFFFF
調色盤 Accessible Contrast-First Vue Components 具有 7 程式碼顏色的組合:
十六進位: #00acc1, RGB: (0, 172, 193); 十六進位: #000000, RGB: (0, 0, 0); 十六進位: #f5f5f5, RGB: (245, 245, 245)
十六進位: #ffc107, RGB: (255, 193, 7); 十六進位: #7e57c2, RGB: (126, 87, 194); 十六進位: #ffffff, RGB: (255, 255, 255)
十六進位: #757575, RGB: (117, 117, 117)
調色板顏色的簡化版本
色調 cadetblue, 黑色的, 色調 gold, 陰影 slateblue, 白色的, 陰影 dimgrey
配色方案是由 raccoon
調色盤中的顏色代碼
Accessible Contrast-First Vue Components 表中顏色代碼 HEX、RGB 訊息
| 顏色 | 十六進位 | RGB | 姓名 | 備用名稱 |
| #00acc1 | #00acc1 | RGB(0, 172, 193) | ADA Aqua | — |
| #000000 | #000000 | RGB(0, 0, 0) | Standard Black | Black |
| #f5f5f5 | #f5f5f5 | RGB(245, 245, 245) | Banner Light | White Smoke |
| #ffc107 | #ffc107 | RGB(255, 193, 7) | Headline Amber | — |
| #7e57c2 | #7e57c2 | RGB(126, 87, 194) | Link Purple | — |
| #ffffff | #ffffff | RGB(255, 255, 255) | Modal White | White |
| #757575 | #757575 | RGB(117, 117, 117) | Form Label Gray | Sonic Silver |
色彩調色板對比度
7 色彩搭配對比度過低,需要改善,這可能會影響可讀性。
| 文字顏色 | 背景顏色 | 對比 |
#00acc1 | #ffc107 | 1.67 |
#00acc1 | #7e57c2 | 1.9 |
#00acc1 | #757575 | 1.68 |
#f5f5f5 | #ffc107 | 1.49 |
#f5f5f5 | #ffffff | 1.09 |
#ffc107 | #ffffff | 1.63 |
圖像調色板 Accessible Contrast-First Vue Components PNG
匯出調色盤
下載 "Accessible Contrast-First Vue Components" 多種格式,以便無縫整合到您的設計專案中。
可用格式:
