色名 · #DCDCE5
Violet Breeze
Violet Breezeは#DCDCE5：rgb(220 220 229)、hsl(240 15% 88%)、oklch(0.897 0.012 286.2)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Gray mean? → · Violet Breeze color name →
#DCDCE5
oklch(0.897 0.012 286.2)
カラー変換
- HEX
- #dcdce5
- RGB
- rgb(220 220 229)
- HSL
- hsl(240 15% 88%)
- HWB
- hwb(240 86% 10%)
- OKLCH
- oklch(0.897 0.012 286.2)
- OKLab
- oklab(0.897 0.003 -0.012)
- CIE Lab
- lab(87.96 1.23 -4.42)
- LCH
- lch(87.96 4.59 285.6)
- CMYK
- cmyk(4% 4% 0% 10%)
ティント · シェード · トーン
ティント
- DFDFE8
- E3E3EA
- E6E6ED
- EAEAEF
- EDEDF2
- F1F1F5
- F4F4F7
- F8F8FA
- FBFBFC
シェード
- BFBFC7
- A3A3AA
- 88888E
- 6E6E72
- 545458
- 3C3C3F
- 262628
- 111112
- 020203
トーン
- D2D2DA
- C9C9D0
- BFBFC6
- B6B6BB
- ADADB1
- A4A4A7
- 9B9B9D
- 929293
- 89898A
カラーハーモニー
補色 +180°
- DCDCE5
Violet Breeze
- DEDED5
≈ Gulf Breeze
類似色 -30° +30°
- DCDCE5
Violet Breeze
- D8DEE5
≈ Billowing Clouds
- E0DBE3
≈ He Loves Me
トライアド +120° +240°
- DCDCE5
Violet Breeze
- E4DBD6
≈ Grim Grey
- D6E0DB
≈ Rapier Silver
スプリットコンプリメンタリー +150° +210°
- DCDCE5
Violet Breeze
- E2DCD4
≈ Milky
- D9DFD7
≈ White Sash
テトラード +90° +180° +270°
- DCDCE5
Violet Breeze
- E5DADA
≈ Lavender Bikini
- DEDED5
≈ Gulf Breeze
- D4E0E0
≈ Pristine Petal
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.36:1 · APCA Lc 18
Ag
AAA黒の上
WCAG 15.41:1 · APCA Lc 86
最適な文字色: #000000
WCAG 15.41:1 (AAA) · APCA Lc 86
Contrast pairs
コードスニペット
CSS
:root {
--violet-breeze: #dcdce5;
--violet-breeze-rgb: 220 220 229;
--violet-breeze-oklch: oklch(0.897 0.012 286.2);
}
.element {
color: var(--violet-breeze);
background-color: hsl(240 15% 88%);
border-color: oklch(0.897 0.012 286.2);
}Tailwind CSS v4
@theme {
--color-violet-breeze: #dcdce5;
--color-violet-breeze-50: #f5f5f8;
--color-violet-breeze-100: #e7e7ec;
--color-violet-breeze-200: #d4d3d9;
--color-violet-breeze-300: #b7b6bd;
--color-violet-breeze-400: #9d9da5;
--color-violet-breeze-500: #85858e;
--color-violet-breeze-600: #717178;
--color-violet-breeze-700: #5a5a60;
--color-violet-breeze-800: #424247;
--color-violet-breeze-900: #2d2d31;
--color-violet-breeze-950: #1a1a1d;
}SCSS
$violet-breeze: #dcdce5;
$violet-breeze-rgb: 220, 220, 229;
$violet-breeze-light: mix(#fff, $violet-breeze, 20%);
$violet-breeze-dark: mix(#000, $violet-breeze, 20%);
.element {
color: $violet-breeze;
box-shadow: 0 0 0 2px rgba($violet-breeze, 0.35);
}