Nazwany kolor · #C2A593
Pragmatic
Pragmatic to #C2A593: rgb(194 165 147), hsl(23 28% 67%), oklch(0.743 0.043 53.7). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Orange mean? → · Pragmatic color name →
#C2A593
oklch(0.743 0.043 53.7)
Konwersje koloru
- HEX
- #c2a593
- RGB
- rgb(194 165 147)
- HSL
- hsl(23 28% 67%)
- HWB
- hwb(23 58% 24%)
- OKLCH
- oklch(0.743 0.043 53.7)
- OKLab
- oklab(0.743 0.025 0.034)
- CIE Lab
- lab(70 8.91 13.51)
- LCH
- lch(70 16.18 56.6)
- CMYK
- cmyk(0% 15% 24% 24%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- C8AE9D
- CEB7A8
- D4BFB3
- DAC8BD
- E1D1C8
- E7DAD3
- EDE3DE
- F3EDE9
- F9F6F4
Odcienie ciemniejsze
- A88F7F
- 8F796C
- 776559
- 605147
- 493D36
- 342B25
- 201A16
- 0E0A08
- 020101
Tony
- BBA191
- B59E8F
- AE9A8D
- A7968C
- A1928A
- 9A8F88
- 948B86
- 8D8784
- 868482
Harmonie kolorów
Komplementarna +180°
- C2A593
Pragmatic
- 92B1C3
≈ Bright Bluebonnet
Analogowa -30° +30°
- C2A593
Pragmatic
- C5A29F
≈ Pale Mauve
- B9AA8E
≈ Prairie Dust
Triada +120° +240°
- C2A593
Pragmatic
- 91B5A9
≈ Treetop
- ACA7C5
≈ Eyeshadow Viola
Komplementarna rozszczepiona +150° +210°
- C2A593
Pragmatic
- 8DB4B8
≈ Summit
- 9EACC7
≈ Satin Soft Blue
Tetrada +90° +180° +270°
- C2A593
Pragmatic
- 9CB39B
≈ Copper Patina
- 92B1C3
≈ Bright Bluebonnet
- B9A3BB
≈ Svelte
Kontrast i dostępność
Ag
FailNa bieli
WCAG 2.30:1 · APCA Lc 46
Ag
AAANa czerni
WCAG 9.09:1 · APCA Lc 57
Najlepszy kolor tekstu: #000000
WCAG 9.09:1 (AAA) · APCA Lc 57
Contrast pairs
Fragmenty kodu
CSS
:root {
--pragmatic: #c2a593;
--pragmatic-rgb: 194 165 147;
--pragmatic-oklch: oklch(0.743 0.043 53.7);
}
.element {
color: var(--pragmatic);
background-color: hsl(23 28% 67%);
border-color: oklch(0.743 0.043 53.7);
}Tailwind CSS v4
@theme {
--color-pragmatic: #c2a593;
--color-pragmatic-50: #fff2ea;
--color-pragmatic-100: #f4e5db;
--color-pragmatic-200: #e3d0c3;
--color-pragmatic-300: #c9b2a3;
--color-pragmatic-400: #b39887;
--color-pragmatic-500: #9d7f6c;
--color-pragmatic-600: #856c5c;
--color-pragmatic-700: #6b5649;
--color-pragmatic-800: #4f3e35;
--color-pragmatic-900: #372b24;
--color-pragmatic-950: #221813;
}SCSS
$pragmatic: #c2a593;
$pragmatic-rgb: 194, 165, 147;
$pragmatic-light: mix(#fff, $pragmatic, 20%);
$pragmatic-dark: mix(#000, $pragmatic, 20%);
.element {
color: $pragmatic;
box-shadow: 0 0 0 2px rgba($pragmatic, 0.35);
}