最も近い色名 · #451E56
#451E56
最も近い色名: Plunged Into Darkness
#451E56(rgb(69 30 86)、hsl(282 48% 23%)、oklch(0.318 0.103 314.3))に最も近い色名はPlunged Into Darknessです。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
#451E56
oklch(0.318 0.103 314.3)
カラー変換
- HEX
- #451e56
- RGB
- rgb(69 30 86)
- HSL
- hsl(282 48% 23%)
- HWB
- hwb(282 12% 66%)
- OKLCH
- oklch(0.318 0.103 314.3)
- OKLab
- oklab(0.318 0.072 -0.074)
- CIE Lab
- lab(19.3 26.86 -26.4)
- LCH
- lch(19.3 37.66 315.5)
- CMYK
- cmyk(20% 65% 0% 66%)
ティント · シェード · トーン
ティント
- 563366
- 674876
- 795D87
- 8B7398
- 9E89A8
- B1A0B9
- C4B7CA
- D7CEDC
- EBE6ED
シェード
- 3B194A
- 31133E
- 270E32
- 1E0927
- 15051C
- 0C0312
- 050108
- 020002
- 000000
トーン
- 4B285B
- 51325F
- 573C64
- 5D4668
- 624F6C
- 685970
- 6E6374
- 746C78
- 7A767C
カラーハーモニー
補色 +180°
- 451E56
Plunged Into Darkness
- 1D3C00
≈ Hunter Green
類似色 -30° +30°
- 451E56
Plunged Into Darkness
- 2E2764
≈ Paris M
- 54173F
≈ Violet Carmine
トライアド +120° +240°
- 451E56
Plunged Into Darkness
- 462C00
≈ Stirland Mud
- 003B3B
≈ Customs Green
スプリットコンプリメンタリー +150° +210°
- 451E56
Plunged Into Darkness
- 383400
≈ Wasabi Nori
- 003D29
≈ Deep Fir
テトラード +90° +180° +270°
- 451E56
Plunged Into Darkness
- 571E00
≈ Conker Brown
- 1D3C00
≈ Hunter Green
- 003949
≈ Natural Indigo
コントラストとアクセシビリティ
Ag
AAA白の上
WCAG 13.34:1 · APCA Lc 99
Ag
Fail黒の上
WCAG 1.57:1 · APCA Lc 0
最適な文字色: #FFFFFF
WCAG 13.34:1 (AAA) · APCA Lc 99
Contrast pairs
コードスニペット
CSS
:root {
--plunged-into-darkness: #451e56;
--plunged-into-darkness-rgb: 69 30 86;
--plunged-into-darkness-oklch: oklch(0.318 0.103 314.3);
}
.element {
color: var(--plunged-into-darkness);
background-color: hsl(282 48% 23%);
border-color: oklch(0.318 0.103 314.3);
}Tailwind CSS v4
@theme {
--color-plunged-into-darkness: #451e56;
--color-plunged-into-darkness-50: #ffedff;
--color-plunged-into-darkness-100: #f6deff;
--color-plunged-into-darkness-200: #e6c7f2;
--color-plunged-into-darkness-300: #cca8db;
--color-plunged-into-darkness-400: #b58cc9;
--color-plunged-into-darkness-500: #9f70b5;
--color-plunged-into-darkness-600: #865f99;
--color-plunged-into-darkness-700: #6c4c7b;
--color-plunged-into-darkness-800: #4e375c;
--color-plunged-into-darkness-900: #372640;
--color-plunged-into-darkness-950: #211429;
}SCSS
$plunged-into-darkness: #451e56;
$plunged-into-darkness-rgb: 69, 30, 86;
$plunged-into-darkness-light: mix(#fff, $plunged-into-darkness, 20%);
$plunged-into-darkness-dark: mix(#000, $plunged-into-darkness, 20%);
.element {
color: $plunged-into-darkness;
box-shadow: 0 0 0 2px rgba($plunged-into-darkness, 0.35);
}