最も近い色名 · #E3E7E8
#E3E7E8
最も近い色名: Shaving Cream
#E3E7E8（rgb(227 231 232)、hsl(192 10% 90%)、oklch(0.925 0.005 214.3)）に最も近い色名はShaving Creamです。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
#E3E7E8
oklch(0.925 0.005 214.3)
カラー変換
- HEX
- #e3e7e8
- RGB
- rgb(227 231 232)
- HSL
- hsl(192 10% 90%)
- HWB
- hwb(192 89% 9%)
- OKLCH
- oklch(0.925 0.005 214.3)
- OKLab
- oklab(0.925 -0.004 -0.003)
- CIE Lab
- lab(91.36 -1.25 -0.98)
- LCH
- lch(91.36 1.59 218.1)
- CMYK
- cmyk(2% 0% 0% 9%)
ティント · シェード · トーン
ティント
- E6E9EA
- E9ECED
- EBEEEF
- EEF1F1
- F1F3F3
- F4F5F6
- F7F8F8
- F9FAFA
- FCFDFD
シェード
- C5C9CA
- A8ABAC
- 8C8F90
- 717374
- 575959
- 3F4040
- 272829
- 121313
- 030303
トーン
- D9DCDD
- CED2D2
- C4C7C8
- BABCBD
- B0B2B3
- A6A8A8
- 9D9E9E
- 939494
- 898A8A
カラーハーモニー
補色 +180°
- E3E7E8
Shaving Cream
- E9E5E4
≈ Winged Victory
類似色 -30° +30°
- E3E7E8
Shaving Cream
- E3E7E6
≈ White Lake
- E4E7E9
≈ Winter Day
トライアド +120° +240°
- E3E7E8
Shaving Cream
- E8E5E7
≈ White Lilac
- E7E6E3
≈ Pearl Brite
スプリットコンプリメンタリー +150° +210°
- E3E7E8
Shaving Cream
- E9E5E6
≈ Minuet White
- E8E6E3
≈ Soft Violet
テトラード +90° +180° +270°
- E3E7E8
Shaving Cream
- E7E5E9
≈ White Lilac
- E9E5E4
≈ Winged Victory
- E5E7E3
≈ Whale Bone
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.24:1 · APCA Lc 12
Ag
AAA黒の上
WCAG 16.86:1 · APCA Lc 92
最適な文字色: #000000
WCAG 16.86:1 (AAA) · APCA Lc 92
Contrast pairs
コードスニペット
CSS
:root {
--shaving-cream: #e3e7e8;
--shaving-cream-rgb: 227 231 232;
--shaving-cream-oklch: oklch(0.925 0.005 214.3);
}
.element {
color: var(--shaving-cream);
background-color: hsl(192 10% 90%);
border-color: oklch(0.925 0.005 214.3);
}Tailwind CSS v4
@theme {
--color-shaving-cream: #e3e7e8;
--color-shaving-cream-50: #f4f5f6;
--color-shaving-cream-100: #e6e8e9;
--color-shaving-cream-200: #d2d5d5;
--color-shaving-cream-300: #b5b8b9;
--color-shaving-cream-400: #9b9fa0;
--color-shaving-cream-500: #838788;
--color-shaving-cream-600: #6f7273;
--color-shaving-cream-700: #595b5c;
--color-shaving-cream-800: #414343;
--color-shaving-cream-900: #2d2e2e;
--color-shaving-cream-950: #1a1b1b;
}SCSS
$shaving-cream: #e3e7e8;
$shaving-cream-rgb: 227, 231, 232;
$shaving-cream-light: mix(#fff, $shaving-cream, 20%);
$shaving-cream-dark: mix(#000, $shaving-cream, 20%);
.element {
color: $shaving-cream;
box-shadow: 0 0 0 2px rgba($shaving-cream, 0.35);
}