色名 · #E6CFCE
Slightly Rose
Slightly Roseは#E6CFCE：rgb(230 207 206)、hsl(2 32% 85%)、oklch(0.873 0.026 20.7)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Gray mean? → · Slightly Rose color name →
#E6CFCE
oklch(0.873 0.026 20.7)
カラー変換
- HEX
- #e6cfce
- RGB
- rgb(230 207 206)
- HSL
- hsl(2 32% 85%)
- HWB
- hwb(2 81% 10%)
- OKLCH
- oklch(0.873 0.026 20.7)
- OKLab
- oklab(0.873 0.024 0.009)
- CIE Lab
- lab(85.04 8.16 3.57)
- LCH
- lch(85.04 8.91 23.7)
- CMYK
- cmyk(0% 10% 10% 10%)
ティント · シェード · トーン
ティント
- E9D4D3
- EBD8D8
- EEDDDD
- F0E2E1
- F3E7E6
- F5ECEB
- F8F0F0
- FAF5F5
- FDFAFA
シェード
- C8B4B3
- AB9998
- 8E7F7F
- 736766
- 594F4E
- 403838
- 282323
- 13100F
- 030202
トーン
- DBC7C6
- D1BFBE
- C6B7B6
- BCAFAE
- B2A7A6
- A89F9E
- 9E9797
- 948F8F
- 8A8887
カラーハーモニー
補色 +180°
- E6CFCE
Slightly Rose
- C3DBDC
≈ Light Dewpoint
類似色 -30° +30°
- E6CFCE
Slightly Rose
- E4CFD7
≈ Ephemeral Red
- E4D1C6
≈ Wheat Seed
トライアド +120° +240°
- E6CFCE
Slightly Rose
- CCDACA
≈ April Mist
- CCD6E7
≈ Mother of Pearl Silver
スプリットコンプリメンタリー +150° +210°
- E6CFCE
Slightly Rose
- C5DBD3
≈ Green Wave
- C5D9E3
≈ Blue Pearl
テトラード +90° +180° +270°
- E6CFCE
Slightly Rose
- D6D7C4
≈ Veltliner White
- C3DBDC
≈ Light Dewpoint
- D5D3E6
≈ Dulcinea
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.48:1 · APCA Lc 23
Ag
AAA黒の上
WCAG 14.18:1 · APCA Lc 81
最適な文字色: #000000
WCAG 14.18:1 (AAA) · APCA Lc 81
Contrast pairs
コードスニペット
CSS
:root {
--slightly-rose: #e6cfce;
--slightly-rose-rgb: 230 207 206;
--slightly-rose-oklch: oklch(0.873 0.026 20.7);
}
.element {
color: var(--slightly-rose);
background-color: hsl(2 32% 85%);
border-color: oklch(0.873 0.026 20.7);
}Tailwind CSS v4
@theme {
--color-slightly-rose: #e6cfce;
--color-slightly-rose-50: #fdf2f2;
--color-slightly-rose-100: #f0e5e4;
--color-slightly-rose-200: #dfd0cf;
--color-slightly-rose-300: #c4b3b1;
--color-slightly-rose-400: #ad9998;
--color-slightly-rose-500: #97807f;
--color-slightly-rose-600: #7f6c6b;
--color-slightly-rose-700: #665656;
--color-slightly-rose-800: #4b3f3f;
--color-slightly-rose-900: #342b2b;
--color-slightly-rose-950: #1f1919;
}SCSS
$slightly-rose: #e6cfce;
$slightly-rose-rgb: 230, 207, 206;
$slightly-rose-light: mix(#fff, $slightly-rose, 20%);
$slightly-rose-dark: mix(#000, $slightly-rose, 20%);
.element {
color: $slightly-rose;
box-shadow: 0 0 0 2px rgba($slightly-rose, 0.35);
}