最も近い色名 · #30458B
#30458B
最も近い色名: Pacific Navy
#30458B（rgb(48 69 139)、hsl(226 49% 37%)、oklch(0.413 0.119 268.3)）に最も近い色名はPacific Navyです。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
#30458B
oklch(0.413 0.119 268.3)
カラー変換
- HEX
- #30458b
- RGB
- rgb(48 69 139)
- HSL
- hsl(226 49% 37%)
- HWB
- hwb(226 19% 45%)
- OKLCH
- oklch(0.413 0.119 268.3)
- OKLab
- oklab(0.413 -0.004 -0.119)
- CIE Lab
- lab(30.61 10.35 -42.34)
- LCH
- lch(30.61 43.58 283.7)
- CMYK
- cmyk(65% 50% 0% 45%)
ティント · シェード · トーン
ティント
- 425797
- 5469A3
- 687BAF
- 7C8DBB
- 91A0C6
- A6B2D2
- BBC5DD
- D1D8E9
- E8EBF4
シェード
- 283B78
- 213166
- 1A2754
- 131E43
- 0C1532
- 060C23
- 030514
- 010207
- 000001
トーン
- 374C8B
- 3F528A
- 475889
- 4E5E89
- 566488
- 5F6A87
- 676F85
- 6F7584
- 787B82
カラーハーモニー
補色 +180°
- 30458B
Pacific Navy
- 5E4800
≈ Mud Brown
類似色 -30° +30°
- 30458B
Pacific Navy
- 005177
≈ Pirate’s Haven
- 543982
≈ Kingfisher Daisy
トライアド +120° +240°
- 30458B
Pacific Navy
- 7F2A23
≈ Posh Red
- 005C22
≈ Sombre Green
スプリットコンプリメンタリー +150° +210°
- 30458B
Pacific Navy
- 713B00
≈ Philippine Bronze
- 475200
≈ Highlands Moss
テトラード +90° +180° +270°
- 30458B
Pacific Navy
- 7B294A
≈ Red Plum
- 5E4800
≈ Mud Brown
- 00584B
≈ Forest Shadows
コントラストとアクセシビリティ
Ag
AAA白の上
WCAG 8.93:1 · APCA Lc 90
Ag
Fail黒の上
WCAG 2.34:1 · APCA Lc 12
最適な文字色: #FFFFFF
WCAG 8.93:1 (AAA) · APCA Lc 90
Contrast pairs
コードスニペット
CSS
:root {
--pacific-navy: #30458b;
--pacific-navy-rgb: 48 69 139;
--pacific-navy-oklch: oklch(0.413 0.119 268.3);
}
.element {
color: var(--pacific-navy);
background-color: hsl(226 49% 37%);
border-color: oklch(0.413 0.119 268.3);
}Tailwind CSS v4
@theme {
--color-pacific-navy: #30458b;
--color-pacific-navy-50: #e8f4ff;
--color-pacific-navy-100: #d8e7ff;
--color-pacific-navy-200: #c0d2ff;
--color-pacific-navy-300: #a0b5f5;
--color-pacific-navy-400: #819be5;
--color-pacific-navy-500: #6581d5;
--color-pacific-navy-600: #566db4;
--color-pacific-navy-700: #445890;
--color-pacific-navy-800: #2f406c;
--color-pacific-navy-900: #202c4c;
--color-pacific-navy-950: #101932;
}SCSS
$pacific-navy: #30458b;
$pacific-navy-rgb: 48, 69, 139;
$pacific-navy-light: mix(#fff, $pacific-navy, 20%);
$pacific-navy-dark: mix(#000, $pacific-navy, 20%);
.element {
color: $pacific-navy;
box-shadow: 0 0 0 2px rgba($pacific-navy, 0.35);
}