Nazwany kolor · #C2A585
Light Pumpkin Brown
Light Pumpkin Brown to #C2A585: rgb(194 165 133), hsl(31 33% 64%), oklch(0.739 0.056 69.6). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Orange mean? → · Light Pumpkin Brown color name →
#C2A585
oklch(0.739 0.056 69.6)
Konwersje koloru
- HEX
- #c2a585
- RGB
- rgb(194 165 133)
- HSL
- hsl(31 33% 64%)
- HWB
- hwb(31 52% 24%)
- OKLCH
- oklch(0.739 0.056 69.6)
- OKLab
- oklab(0.739 0.019 0.052)
- CIE Lab
- lab(69.75 7.49 20.8)
- LCH
- lch(69.75 22.1 70.2)
- CMYK
- cmyk(0% 15% 31% 24%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- C8AE91
- CEB79D
- D4BFA9
- DAC8B5
- E1D1C1
- E7DACD
- EDE3DA
- F3EDE6
- F9F6F2
Odcienie ciemniejsze
- A88F73
- 8F7961
- 776550
- 605140
- 493D30
- 342B21
- 201A13
- 0E0A06
- 020101
Tony
- BBA185
- B59E84
- AE9A84
- A79684
- A19283
- 9A8F83
- 948B82
- 8D8781
- 868481
Harmonie kolorów
Komplementarna +180°
- C2A585
Light Pumpkin Brown
- 90AECD
≈ Chambray Blue
Analogowa -30° +30°
- C2A585
Light Pumpkin Brown
- CA9F91
≈ Adobe Glow
- B3AC84
≈ Tarragon Tease
Triada +120° +240°
- C2A585
Light Pumpkin Brown
- 82B6B2
≈ Cold Front Green
- B5A1C6
≈ Berry Frappé
Komplementarna rozszczepiona +150° +210°
- C2A585
Light Pumpkin Brown
- 83B4C3
≈ Crystal Lake
- A3A8CE
≈ Blossom Mauve
Tetrada +90° +180° +270°
- C2A585
Light Pumpkin Brown
- 8DB69E
≈ Summer Green
- 90AECD
≈ Chambray Blue
- C39DB6
≈ Lily
Kontrast i dostępność
Ag
FailNa bieli
WCAG 2.32:1 · APCA Lc 46
Ag
AAANa czerni
WCAG 9.01:1 · APCA Lc 56
Najlepszy kolor tekstu: #000000
WCAG 9.01:1 (AAA) · APCA Lc 56
Contrast pairs
Fragmenty kodu
CSS
:root {
--light-pumpkin-brown: #c2a585;
--light-pumpkin-brown-rgb: 194 165 133;
--light-pumpkin-brown-oklch: oklch(0.739 0.056 69.6);
}
.element {
color: var(--light-pumpkin-brown);
background-color: hsl(31 33% 64%);
border-color: oklch(0.739 0.056 69.6);
}Tailwind CSS v4
@theme {
--color-light-pumpkin-brown: #c2a585;
--color-light-pumpkin-brown-50: #fff3e4;
--color-light-pumpkin-brown-100: #f4e5d4;
--color-light-pumpkin-brown-200: #e4d1bb;
--color-light-pumpkin-brown-300: #cab399;
--color-light-pumpkin-brown-400: #b4997b;
--color-light-pumpkin-brown-500: #9e805e;
--color-light-pumpkin-brown-600: #866c50;
--color-light-pumpkin-brown-700: #6b573f;
--color-light-pumpkin-brown-800: #4f3f2e;
--color-light-pumpkin-brown-900: #372b1f;
--color-light-pumpkin-brown-950: #22190f;
}SCSS
$light-pumpkin-brown: #c2a585;
$light-pumpkin-brown-rgb: 194, 165, 133;
$light-pumpkin-brown-light: mix(#fff, $light-pumpkin-brown, 20%);
$light-pumpkin-brown-dark: mix(#000, $light-pumpkin-brown, 20%);
.element {
color: $light-pumpkin-brown;
box-shadow: 0 0 0 2px rgba($light-pumpkin-brown, 0.35);
}