色名 · #E3D7E5
Lavender Vista
Lavender Vistaは#E3D7E5：rgb(227 215 229)、hsl(291 21% 87%)、oklch(0.893 0.023 321.4)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Gray mean? → · Lavender Vista color name →
#E3D7E5
oklch(0.893 0.023 321.4)
カラー変換
- HEX
- #e3d7e5
- RGB
- rgb(227 215 229)
- HSL
- hsl(291 21% 87%)
- HWB
- hwb(291 84% 10%)
- OKLCH
- oklch(0.893 0.023 321.4)
- OKLab
- oklab(0.893 0.018 -0.014)
- CIE Lab
- lab(87.27 6.12 -5.35)
- LCH
- lch(87.27 8.12 318.8)
- CMYK
- cmyk(1% 6% 0% 10%)
ティント · シェード · トーン
ティント
- E6DBE8
- E9DFEA
- EBE3ED
- EEE7EF
- F1EBF2
- F4EFF5
- F7F3F7
- F9F7FA
- FCFBFC
シェード
- C5BBC7
- A89FAA
- 8C858E
- 716B72
- 575258
- 3F3B3F
- 272528
- 121112
- 030203
トーン
- D9CEDA
- CEC5D0
- C4BCC6
- BAB3BB
- B0AAB1
- A6A2A7
- 9D999D
- 939193
- 89888A
カラーハーモニー
補色 +180°
- E3D7E5
Lavender Vista
- D4E0D2
≈ Misty Marsh
類似色 -30° +30°
- E3D7E5
Lavender Vista
- DBD9EA
≈ Eyeshadow
- E9D6DD
≈ Swiss Rose
トライアド +120° +240°
- E3D7E5
Lavender Vista
- E3DBCB
≈ Frankly Earnest
- CBE1E2
≈ Melting Point
スプリットコンプリメンタリー +150° +210°
- E3D7E5
Lavender Vista
- DCDDCC
≈ Light Soft Kind
- CEE1DA
≈ Light Meadow Lane
テトラード +90° +180° +270°
- E3D7E5
Lavender Vista
- E9D8CE
≈ Malted Milk
- D4E0D2
≈ Misty Marsh
- CDDFE8
≈ Duck’s Egg Blue
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.38:1 · APCA Lc 19
Ag
AAA黒の上
WCAG 15.11:1 · APCA Lc 85
最適な文字色: #000000
WCAG 15.11:1 (AAA) · APCA Lc 85
Contrast pairs
コードスニペット
CSS
:root {
--lavender-vista: #e3d7e5;
--lavender-vista-rgb: 227 215 229;
--lavender-vista-oklch: oklch(0.893 0.023 321.4);
}
.element {
color: var(--lavender-vista);
background-color: hsl(291 21% 87%);
border-color: oklch(0.893 0.023 321.4);
}Tailwind CSS v4
@theme {
--color-lavender-vista: #e3d7e5;
--color-lavender-vista-50: #f8f3f9;
--color-lavender-vista-100: #ece5ec;
--color-lavender-vista-200: #d9d1da;
--color-lavender-vista-300: #bdb4be;
--color-lavender-vista-400: #a59aa7;
--color-lavender-vista-500: #8d818f;
--color-lavender-vista-600: #786e79;
--color-lavender-vista-700: #605861;
--color-lavender-vista-800: #464047;
--color-lavender-vista-900: #302c31;
--color-lavender-vista-950: #1d191d;
}SCSS
$lavender-vista: #e3d7e5;
$lavender-vista-rgb: 227, 215, 229;
$lavender-vista-light: mix(#fff, $lavender-vista, 20%);
$lavender-vista-dark: mix(#000, $lavender-vista, 20%);
.element {
color: $lavender-vista;
box-shadow: 0 0 0 2px rgba($lavender-vista, 0.35);
}