Màu có tên gần nhất · #E2BDC6
#E2BDC6
Màu có tên gần nhất: Grandma’s Pink Tiles
#E2BDC6 (rgb(226 189 198), hsl(345 39% 81%), oklch(0.833 0.044 1.7)) gần nhất với màu có tên Grandma’s Pink Tiles. Xem sắc nhạt, sắc đậm, hòa sắc, tương phản WCAG và APCA, cùng mã CSS, Tailwind v4 và SCSS.
#E2BDC6
oklch(0.833 0.044 1.7)
Chuyển đổi màu
- HEX
- #e2bdc6
- RGB
- rgb(226 189 198)
- HSL
- hsl(345 39% 81%)
- HWB
- hwb(345 74% 11%)
- OKLCH
- oklch(0.833 0.044 1.7)
- OKLab
- oklab(0.833 0.044 0.001)
- CIE Lab
- lab(80.08 14.71 0.66)
- LCH
- lch(80.08 14.72 2.6)
- CMYK
- cmyk(0% 16% 12% 11%)
Sắc nhạt · Sắc đậm · Sắc xám
Sắc nhạt
- E5C3CC
- E8CAD1
- EBD1D7
- EED7DC
- F1DEE2
- F4E4E8
- F7EBEE
- F9F2F3
- FCF8F9
Sắc đậm
- C4A4AC
- A88C92
- 8C747A
- 715D62
- 57474B
- 3E3335
- 271F21
- 120D0E
- 030202
Sắc xám
- D8B7BF
- CEB1B8
- C4AAB0
- BAA4A9
- B09EA2
- A6989B
- 9D9294
- 938C8E
- 898687
Hòa sắc
Bổ túc +180°
- E2BDC6
Grandma’s Pink Tiles
- AAD2CA
≈ Cassiopeia
Tương đồng -30° +30°
- E2BDC6
Grandma’s Pink Tiles
- DABED5
≈ Ooh la La
- E3BFB7
≈ Muddy Rose
Bộ ba +120° +240°
- E2BDC6
Grandma’s Pink Tiles
- C3CDAE
≈ Growing Season
- B0CDE3
≈ Charted
Bổ túc chia +150° +210°
- E2BDC6
Grandma’s Pink Tiles
- B4D1BA
≈ Pitcher
- A8D0D9
≈ Aqua Frost
Bộ bốn +90° +180° +270°
- E2BDC6
Grandma’s Pink Tiles
- D2C8A9
≈ Desert Cover
- AAD2CA
≈ Cassiopeia
- BEC7E6
≈ Pale Wisteria
Tương phản và khả năng tiếp cận
Ag
FailTrên nền trắng
WCAG 1.70:1 · APCA Lc 30
Ag
AAATrên nền đen
WCAG 12.32:1 · APCA Lc 72
Màu chữ tốt nhất: #000000
WCAG 12.32:1 (AAA) · APCA Lc 72
Contrast pairs
Đoạn mã
CSS
:root {
--grandma-s-pink-tiles: #e2bdc6;
--grandma-s-pink-tiles-rgb: 226 189 198;
--grandma-s-pink-tiles-oklch: oklch(0.833 0.044 1.7);
}
.element {
color: var(--grandma-s-pink-tiles);
background-color: hsl(345 39% 81%);
border-color: oklch(0.833 0.044 1.7);
}Tailwind CSS v4
@theme {
--color-grandma-s-pink-tiles: #e2bdc6;
--color-grandma-s-pink-tiles-50: #fff0f4;
--color-grandma-s-pink-tiles-100: #f6e2e6;
--color-grandma-s-pink-tiles-200: #e6cdd2;
--color-grandma-s-pink-tiles-300: #ccafb5;
--color-grandma-s-pink-tiles-400: #b6949c;
--color-grandma-s-pink-tiles-500: #a07a84;
--color-grandma-s-pink-tiles-600: #876870;
--color-grandma-s-pink-tiles-700: #6c5359;
--color-grandma-s-pink-tiles-800: #503c42;
--color-grandma-s-pink-tiles-900: #37292d;
--color-grandma-s-pink-tiles-950: #22171a;
}SCSS
$grandma-s-pink-tiles: #e2bdc6;
$grandma-s-pink-tiles-rgb: 226, 189, 198;
$grandma-s-pink-tiles-light: mix(#fff, $grandma-s-pink-tiles, 20%);
$grandma-s-pink-tiles-dark: mix(#000, $grandma-s-pink-tiles, 20%);
.element {
color: $grandma-s-pink-tiles;
box-shadow: 0 0 0 2px rgba($grandma-s-pink-tiles, 0.35);
}