色名 · #4A4E5D
Ombre Blue
Ombre Blueは#4A4E5D：rgb(74 78 93)、hsl(227 11% 33%)、oklch(0.426 0.025 273.5)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Gray mean? → · Ombre Blue color name →
#4A4E5D
oklch(0.426 0.025 273.5)
カラー変換
- HEX
- #4a4e5d
- RGB
- rgb(74 78 93)
- HSL
- hsl(227 11% 33%)
- HWB
- hwb(227 29% 64%)
- OKLCH
- oklch(0.426 0.025 273.5)
- OKLab
- oklab(0.426 0.002 -0.025)
- CIE Lab
- lab(33.24 1.06 -9.41)
- LCH
- lch(33.24 9.47 276.4)
- CMYK
- cmyk(20% 16% 0% 64%)
ティント · シェード · トーン
ティント
- 5A5E6C
- 6B6E7B
- 7C7F8B
- 8E909A
- A0A2AB
- B2B4BB
- C5C6CC
- D8D9DD
- EBECEE
シェード
- 3F4350
- 353843
- 2A2D37
- 20232A
- 17191F
- 0E0F14
- 06070A
- 020203
- 000000
トーン
- 4F5360
- 545864
- 5A5D67
- 5F626B
- 64676E
- 6A6C72
- 6F7175
- 757679
- 7A7B7C
カラーハーモニー
補色 +180°
- 4A4E5D
Ombre Blue
- 534F3F
≈ Jungle Cover
類似色 -30° +30°
- 4A4E5D
Ombre Blue
- 43515C
≈ Royal Navy
- 514C5A
≈ Mulled Wine
トライアド +120° +240°
- 4A4E5D
Ombre Blue
- 5C4A46
≈ Chocolate Soul
- 445348
≈ Rock Garden
スプリットコンプリメンタリー +150° +210°
- 4A4E5D
Ombre Blue
- 594C40
≈ Rare Wood
- 4C5142
≈ Forestwood
テトラード +90° +180° +270°
- 4A4E5D
Ombre Blue
- 5B494D
≈ Deep Aubergine
- 534F3F
≈ Jungle Cover
- 3F5350
≈ Gedney Green
コントラストとアクセシビリティ
Ag
AAA白の上
WCAG 8.27:1 · APCA Lc 89
Ag
Fail黒の上
WCAG 2.53:1 · APCA Lc 14
最適な文字色: #FFFFFF
WCAG 8.27:1 (AAA) · APCA Lc 89
Contrast pairs
コードスニペット
CSS
:root {
--ombre-blue: #4a4e5d;
--ombre-blue-rgb: 74 78 93;
--ombre-blue-oklch: oklch(0.426 0.025 273.5);
}
.element {
color: var(--ombre-blue);
background-color: hsl(227 11% 33%);
border-color: oklch(0.426 0.025 273.5);
}Tailwind CSS v4
@theme {
--color-ombre-blue: #4a4e5d;
--color-ombre-blue-50: #f3f5fd;
--color-ombre-blue-100: #e5e7f1;
--color-ombre-blue-200: #d1d4df;
--color-ombre-blue-300: #b3b7c5;
--color-ombre-blue-400: #999eae;
--color-ombre-blue-500: #808598;
--color-ombre-blue-600: #6d7180;
--color-ombre-blue-700: #575a67;
--color-ombre-blue-800: #3f424b;
--color-ombre-blue-900: #2b2e34;
--color-ombre-blue-950: #191a20;
}SCSS
$ombre-blue: #4a4e5d;
$ombre-blue-rgb: 74, 78, 93;
$ombre-blue-light: mix(#fff, $ombre-blue, 20%);
$ombre-blue-dark: mix(#000, $ombre-blue, 20%);
.element {
color: $ombre-blue;
box-shadow: 0 0 0 2px rgba($ombre-blue, 0.35);
}