配色調色盤

鋼藍色

像鋼鐵反射的光線一樣,以灰色為底的中藍色。在CSS中稱為steelblue。沉穩又有技術感,適合介面和工業類品牌。

又稱:鋼鐵藍, 鋼青色

鋼藍色 · #4682B4

鋼藍色的基本資訊

鋼藍色(#4682B4)是冷色系、中等亮度、中等飽和度的顏色,屬於藍色系。RGB 值為紅 70、綠 130、藍 180(各 255 階)。常見用途:網頁, 工業, 時尚。

鋼藍色的深淺:亮色調與暗色調

由淺到深依序排列。點一下顏色就能複製色碼。

鋼藍色的色彩和諧配色

依據色環產生的配色。到色彩和諧工具可以試試更多組合。

互補色相近顏色:銅色
類似色相近顏色:蒂芬妮藍, 鈷藍色
三等分配色相近顏色:梅子紫, 開心果綠
分裂互補色相近顏色:印度紅, 古金色
四角配色相近顏色:蘭花紫, 銅色, 森林綠

使用鋼藍色的配色色票

可以直接複製色碼,或在編輯器中開啟自由調整。

單色配色 · 鋼藍色
類似色配色 · 鋼藍色
互補色配色 · 鋼藍色
三等分配色 · 鋼藍色
搭配中性色配色 · 鋼藍色
搭配強調色配色 · 鋼藍色

鋼藍色與文字顏色的對比

白色文字對比度 4.1:1 · AA(大字)
黑色文字對比度 5.1:1 · AA

依據 WCAG 2.1 標準。其他顏色組合可以用對比檢查工具確認。

CSS 程式碼

:root {
  --steel-blue: #4682B4;
  --steel-blue-rgb: 70, 130, 180;
}
.bg { background-color: var(--steel-blue); }
.text { color: var(--steel-blue); }

和鋼藍色相近的顏色

蔚藍色藍灰色法國藍石板灰石油藍鋼灰色嬰兒藍鉛灰色天藍色丹寧藍

使用這個顏色的主題配色

其他藍色系

藍色海軍藍天藍色鈷藍色藍寶石色皇家藍電光藍午夜藍群青色法國藍普魯士藍粉彩藍嬰兒藍丹寧藍克萊因藍深藍色淺藍色蔚藍色

常見問題

鋼藍色的色碼是多少?

鋼藍色的 HEX 色碼是 #4682B4。RGB 為 rgb(70, 130, 180),HSL 為 hsl(207, 44%, 49%),CMYK 為 61, 28, 0, 29。

鋼藍色的互補色是什麼?

在色環上位於對面的互補色是 #B47846,色調接近銅色。少量用來當強調色,就能做出強烈的對比。

在鋼藍色上放白色文字好閱讀嗎?

建議改用黑色文字。和白色的對比度只有 4.1:1,和黑色則有 5.1:1。