色名 · #25476A
Commodore
Commodoreは#25476A：rgb(37 71 106)、hsl(210 48% 28%)、oklch(0.39 0.072 250.8)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Blue mean? → · Commodore color name →
#25476A
oklch(0.39 0.072 250.8)
カラー変換
- HEX
- #25476a
- RGB
- rgb(37 71 106)
- HSL
- hsl(210 48% 28%)
- HWB
- hwb(210 15% 58%)
- OKLCH
- oklch(0.39 0.072 250.8)
- OKLab
- oklab(0.39 -0.024 -0.068)
- CIE Lab
- lab(28.91 -3.52 -24.52)
- LCH
- lch(28.91 24.77 261.8)
- CMYK
- cmyk(65% 33% 0% 58%)
ティント · シェード · トーン
ティント
- 395878
- 4E6987
- 627B95
- 778DA4
- 8D9FB3
- A3B2C2
- B9C4D1
- D0D8E0
- E7EBF0
シェード
- 1F3D5B
- 19324D
- 13283F
- 0D1F31
- 081624
- 040D18
- 02060D
- 000204
- 000000
トーン
- 2F4D6D
- 38526F
- 415871
- 4A5E74
- 536476
- 5C6978
- 656F7A
- 6E757C
- 777A7E
カラーハーモニー
補色 +180°
- 25476A
Commodore
- 5D3D12
≈ Hippogriff Brown
類似色 -30° +30°
- 25476A
Commodore
- 004D60
≈ Raging Thunderstorm
- 3E406B
≈ Gloomy Blue
トライアド +120° +240°
- 25476A
Commodore
- 65333B
≈ Power Tie
- 374D21
≈ Chestnut Green
スプリットコンプリメンタリー +150° +210°
- 25476A
Commodore
- 653725
≈ Hairy Heath
- 4D4610
≈ Sugarloaf Brown
テトラード +90° +180° +270°
コントラストとアクセシビリティ
Ag
AAA白の上
WCAG 9.59:1 · APCA Lc 92
Ag
Fail黒の上
WCAG 2.18:1 · APCA Lc 10
最適な文字色: #FFFFFF
WCAG 9.59:1 (AAA) · APCA Lc 92
Contrast pairs
コードスニペット
CSS
:root {
--commodore: #25476a;
--commodore-rgb: 37 71 106;
--commodore-oklch: oklch(0.39 0.072 250.8);
}
.element {
color: var(--commodore);
background-color: hsl(210 48% 28%);
border-color: oklch(0.39 0.072 250.8);
}Tailwind CSS v4
@theme {
--color-commodore: #25476a;
--color-commodore-50: #e7f7ff;
--color-commodore-100: #d7eaff;
--color-commodore-200: #bfd7f3;
--color-commodore-300: #9ebadc;
--color-commodore-400: #7fa2c8;
--color-commodore-500: #628ab5;
--color-commodore-600: #537598;
--color-commodore-700: #425d7a;
--color-commodore-800: #2e455a;
--color-commodore-900: #1f2f3f;
--color-commodore-950: #0f1c28;
}SCSS
$commodore: #25476a;
$commodore-rgb: 37, 71, 106;
$commodore-light: mix(#fff, $commodore, 20%);
$commodore-dark: mix(#000, $commodore, 20%);
.element {
color: $commodore;
box-shadow: 0 0 0 2px rgba($commodore, 0.35);
}