最も近い色名 · #B897DC
#B897DC
最も近い色名: Violet Velvet
#B897DC(rgb(184 151 220)、hsl(269 50% 73%)、oklch(0.731 0.104 305.9))に最も近い色名はViolet Velvetです。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
#B897DC
oklch(0.731 0.104 305.9)
カラー変換
- HEX
- #b897dc
- RGB
- rgb(184 151 220)
- HSL
- hsl(269 50% 73%)
- HWB
- hwb(269 59% 14%)
- OKLCH
- oklch(0.731 0.104 305.9)
- OKLab
- oklab(0.731 0.061 -0.084)
- CIE Lab
- lab(67.42 22.61 -30.65)
- LCH
- lch(67.42 38.09 306.4)
- CMYK
- cmyk(16% 31% 0% 14%)
ティント · シェード · トーン
ティント
- BFA1E0
- C6ACE4
- CDB6E7
- D4C0EB
- DBCBEE
- E2D5F2
- E9DFF5
- F0EAF9
- F8F4FC
シェード
- A083BF
- 886FA3
- 715C88
- 5B496E
- 453754
- 31263C
- 1E1726
- 0C0811
- 020102
トーン
- B295D3
- AD93C9
- A791C0
- A18EB7
- 9C8CAE
- 968AA4
- 90879B
- 8B8592
- 858389
カラーハーモニー
補色 +180°
- B897DC
Violet Velvet
- 98B46A
≈ Light Birch Green
類似色 -30° +30°
- B897DC
Violet Velvet
- 96A2E9
≈ Cold Lips
- D18FC1
≈ Pressed Flower
トライアド +120° +240°
- B897DC
Violet Velvet
- D59B5F
≈ Ritzy
- 4CBDB2
≈ Arctic Green
スプリットコンプリメンタリー +150° +210°
- B897DC
Violet Velvet
- BBA857
≈ Yellow Maize
- 6FBC8C
≈ Young Bamboo
テトラード +90° +180° +270°
- B897DC
Violet Velvet
- E1907A
≈ Nude Flamingo
- 98B46A
≈ Light Birch Green
- 4CB8D1
≈ Teal Moiré
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 2.47:1 · APCA Lc 49
Ag
AAA黒の上
WCAG 8.49:1 · APCA Lc 53
最適な文字色: #000000
WCAG 8.49:1 (AAA) · APCA Lc 53
Contrast pairs
コードスニペット
CSS
:root {
--violet-velvet: #b897dc;
--violet-velvet-rgb: 184 151 220;
--violet-velvet-oklch: oklch(0.731 0.104 305.9);
}
.element {
color: var(--violet-velvet);
background-color: hsl(269 50% 73%);
border-color: oklch(0.731 0.104 305.9);
}Tailwind CSS v4
@theme {
--color-violet-velvet: #b897dc;
--color-violet-velvet-50: #fdeeff;
--color-violet-velvet-100: #f1dfff;
--color-violet-velvet-200: #e0c9f7;
--color-violet-velvet-300: #c6aae1;
--color-violet-velvet-400: #ad8ecf;
--color-violet-velvet-500: #9773bc;
--color-violet-velvet-600: #80629f;
--color-violet-velvet-700: #664e80;
--color-violet-velvet-800: #4a3960;
--color-violet-velvet-900: #332743;
--color-violet-velvet-950: #1f152b;
}SCSS
$violet-velvet: #b897dc;
$violet-velvet-rgb: 184, 151, 220;
$violet-velvet-light: mix(#fff, $violet-velvet, 20%);
$violet-velvet-dark: mix(#000, $violet-velvet, 20%);
.element {
color: $violet-velvet;
box-shadow: 0 0 0 2px rgba($violet-velvet, 0.35);
}