最も近い色名 · #511666
#511666
最も近い色名: Velvet Vortex
#511666（rgb(81 22 102)、hsl(284 65% 24%)、oklch(0.338 0.137 315.4)）に最も近い色名はVelvet Vortexです。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
#511666
oklch(0.338 0.137 315.4)
カラー変換
- HEX
- #511666
- RGB
- rgb(81 22 102)
- HSL
- hsl(284 65% 24%)
- HWB
- hwb(284 9% 60%)
- OKLCH
- oklch(0.338 0.137 315.4)
- OKLab
- oklab(0.338 0.098 -0.096)
- CIE Lab
- lab(20.87 36.96 -34.34)
- LCH
- lch(20.87 50.45 317.1)
- CMYK
- cmyk(21% 78% 0% 60%)
ティント · シェード · トーン
ティント
- 612F75
- 724684
- 835C94
- 9472A3
- A588B2
- B79FC1
- C9B7D1
- DBCEE0
- EDE6EF
シェード
- 451258
- 3A0D4A
- 2F093C
- 24062F
- 1A0323
- 100217
- 07010C
- 020004
- 000000
トーン
- 562469
- 5B2F6C
- 603A6F
- 654472
- 694F75
- 6E5877
- 73627A
- 776C7C
- 7C767E
カラーハーモニー
補色 +180°
- 511666
Velvet Vortex
- 1D4200
≈ Forest Green
類似色 -30° +30°
- 511666
Velvet Vortex
- 352479
≈ Deep Space Rodeo
- 640647
≈ Tyrian Purple
トライアド +120° +240°
- 511666
Velvet Vortex
- 4C3100
≈ Kyoto House
- 004041
≈ Rich Black
スプリットコンプリメンタリー +150° +210°
- 511666
Velvet Vortex
- 3D3900
≈ Camouflage
- 00432E
≈ UP Forest Green
テトラード +90° +180° +270°
- 511666
Velvet Vortex
- 5E2300
≈ Hot Fudge
- 1D4200
≈ Forest Green
- 003E50
≈ Maniac Mansion
コントラストとアクセシビリティ
Ag
AAA白の上
WCAG 12.67:1 · APCA Lc 98
Ag
Fail黒の上
WCAG 1.65:1 · APCA Lc 0
最適な文字色: #FFFFFF
WCAG 12.67:1 (AAA) · APCA Lc 98
Contrast pairs
コードスニペット
CSS
:root {
--velvet-vortex: #511666;
--velvet-vortex-rgb: 81 22 102;
--velvet-vortex-oklch: oklch(0.338 0.137 315.4);
}
.element {
color: var(--velvet-vortex);
background-color: hsl(284 65% 24%);
border-color: oklch(0.338 0.137 315.4);
}Tailwind CSS v4
@theme {
--color-velvet-vortex: #511666;
--color-velvet-vortex-50: #ffeaff;
--color-velvet-vortex-100: #fbdaff;
--color-velvet-vortex-200: #edc2fb;
--color-velvet-vortex-300: #d4a1e6;
--color-velvet-vortex-400: #bd84d5;
--color-velvet-vortex-500: #a866c3;
--color-velvet-vortex-600: #8e57a5;
--color-velvet-vortex-700: #724584;
--color-velvet-vortex-800: #533263;
--color-velvet-vortex-900: #3a2246;
--color-velvet-vortex-950: #24112d;
}SCSS
$velvet-vortex: #511666;
$velvet-vortex-rgb: 81, 22, 102;
$velvet-vortex-light: mix(#fff, $velvet-vortex, 20%);
$velvet-vortex-dark: mix(#000, $velvet-vortex, 20%);
.element {
color: $velvet-vortex;
box-shadow: 0 0 0 2px rgba($velvet-vortex, 0.35);
}