最も近い色名 · #4F60AF
#4F60AF
最も近い色名: Starstruck
#4F60AF（rgb(79 96 175)、hsl(229 38% 50%)、oklch(0.514 0.126 272.1)）に最も近い色名はStarstruckです。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
#4F60AF
oklch(0.514 0.126 272.1)
カラー変換
- HEX
- #4f60af
- RGB
- rgb(79 96 175)
- HSL
- hsl(229 38% 50%)
- HWB
- hwb(229 31% 31%)
- OKLCH
- oklch(0.514 0.126 272.1)
- OKLab
- oklab(0.514 0.005 -0.126)
- CIE Lab
- lab(42.34 11.61 -45.04)
- LCH
- lch(42.34 46.51 284.5)
- CMYK
- cmyk(55% 45% 0% 31%)
ティント · シェード · トーン
ティント
- 5E70B8
- 6F7FC0
- 7F8FC9
- 909FD1
- A2AED9
- B4BEE1
- C6CEE9
- D9DEF0
- ECEFF8
シェード
- 445298
- 384581
- 2E386B
- 232C56
- 192041
- 10152E
- 070A1C
- 02030B
- 000001
トーン
- 5364AB
- 5868A7
- 5D6BA2
- 626E9E
- 677299
- 6C7594
- 717890
- 767B8B
- 7B7D85
カラーハーモニー
補色 +180°
- 4F60AF
Starstruck
- 7D6500
≈ Arousing Alligator
類似色 -30° +30°
- 4F60AF
Starstruck
- 006EA7
≈ Bowen Blue
- 7553A3
≈ Royal Lavender
トライアド +120° +240°
- 4F60AF
Starstruck
- A34736
≈ Toasted Paprika
- 177B41
≈ Tokiwa Green
スプリットコンプリメンタリー +150° +210°
- 4F60AF
Starstruck
- 965500
≈ Charlie Brown
- 5B7200
≈ Topiary Green
テトラード +90° +180° +270°
- 4F60AF
Starstruck
- A04361
≈ Gooseberry
- 7D6500
≈ Arousing Alligator
- 00786B
≈ Pond Moss
コントラストとアクセシビリティ
Ag
AA白の上
WCAG 5.79:1 · APCA Lc 79
Ag
Fail黒の上
WCAG 3.62:1 · APCA Lc 23
最適な文字色: #FFFFFF
WCAG 5.79:1 (AA) · APCA Lc 79
Contrast pairs
コードスニペット
CSS
:root {
--starstruck: #4f60af;
--starstruck-rgb: 79 96 175;
--starstruck-oklch: oklch(0.514 0.126 272.1);
}
.element {
color: var(--starstruck);
background-color: hsl(229 38% 50%);
border-color: oklch(0.514 0.126 272.1);
}Tailwind CSS v4
@theme {
--color-starstruck: #4f60af;
--color-starstruck-50: #e9f3ff;
--color-starstruck-100: #dae6ff;
--color-starstruck-200: #c3d1ff;
--color-starstruck-300: #a3b3f8;
--color-starstruck-400: #8599e9;
--color-starstruck-500: #6a7ed9;
--color-starstruck-600: #5a6bb7;
--color-starstruck-700: #475693;
--color-starstruck-800: #323f6e;
--color-starstruck-900: #222b4d;
--color-starstruck-950: #111833;
}SCSS
$starstruck: #4f60af;
$starstruck-rgb: 79, 96, 175;
$starstruck-light: mix(#fff, $starstruck, 20%);
$starstruck-dark: mix(#000, $starstruck, 20%);
.element {
color: $starstruck;
box-shadow: 0 0 0 2px rgba($starstruck, 0.35);
}