Nazwany kolor · #E2C0A8
Group Hug
Group Hug to #E2C0A8: rgb(226 192 168), hsl(25 50% 77%), oklch(0.831 0.051 57.2). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Orange mean? → · Group Hug color name →
#E2C0A8
oklch(0.831 0.051 57.2)
Konwersje koloru
- HEX
- #e2c0a8
- RGB
- rgb(226 192 168)
- HSL
- hsl(25 50% 77%)
- HWB
- hwb(25 66% 11%)
- OKLCH
- oklch(0.831 0.051 57.2)
- OKLab
- oklab(0.831 0.028 0.043)
- CIE Lab
- lab(80.23 9.87 16.88)
- LCH
- lch(80.23 19.55 59.7)
- CMYK
- cmyk(0% 15% 26% 11%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- E5C6B1
- E8CCB9
- EBD3C2
- EED9CA
- F1DFD3
- F4E6DC
- F7ECE5
- F9F2ED
- FCF9F6
Odcienie ciemniejsze
- C4A792
- A88E7C
- 8C7667
- 715F52
- 57493F
- 3E342C
- 27201A
- 120E0A
- 030201
Tony
- D8B9A4
- CEB3A0
- C4AC9C
- BAA698
- B0A094
- A69990
- 9D938C
- 938D88
- 898684
Harmonie kolorów
Komplementarna +180°
- E2C0A8
Group Hug
- A9CDE5
≈ Escape
Analogowa -30° +30°
- E2C0A8
Group Hug
- E7BCB6
≈ Rose Fog
- D6C6A3
≈ Aloof Lama
Triada +120° +240°
- E2C0A8
Group Hug
- A5D3C7
≈ Refresh
- CBC1E5
≈ Party Hat
Komplementarna rozszczepiona +150° +210°
- E2C0A8
Group Hug
- A2D2D8
≈ Cay
- B9C7EA
≈ Pale Wisteria
Tetrada +90° +180° +270°
- E2C0A8
Group Hug
- B3D1B5
≈ Enchanted Meadow
- A9CDE5
≈ Escape
- DABDD9
≈ Thistle
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.70:1 · APCA Lc 30
Ag
AAANa czerni
WCAG 12.33:1 · APCA Lc 72
Najlepszy kolor tekstu: #000000
WCAG 12.33:1 (AAA) · APCA Lc 72
Contrast pairs
Fragmenty kodu
CSS
:root {
--group-hug: #e2c0a8;
--group-hug-rgb: 226 192 168;
--group-hug-oklch: oklch(0.831 0.051 57.2);
}
.element {
color: var(--group-hug);
background-color: hsl(25 50% 77%);
border-color: oklch(0.831 0.051 57.2);
}Tailwind CSS v4
@theme {
--color-group-hug: #e2c0a8;
--color-group-hug-50: #fff2e7;
--color-group-hug-100: #f5e4d8;
--color-group-hug-200: #e5d0bf;
--color-group-hug-300: #ccb29e;
--color-group-hug-400: #b69782;
--color-group-hug-500: #a17e65;
--color-group-hug-600: #886b56;
--color-group-hug-700: #6d5544;
--color-group-hug-800: #503e32;
--color-group-hug-900: #382b22;
--color-group-hug-950: #231811;
}SCSS
$group-hug: #e2c0a8;
$group-hug-rgb: 226, 192, 168;
$group-hug-light: mix(#fff, $group-hug, 20%);
$group-hug-dark: mix(#000, $group-hug, 20%);
.element {
color: $group-hug;
box-shadow: 0 0 0 2px rgba($group-hug, 0.35);
}