Adlandırılmış renk · #E3C6A3
October Bounty
October Bounty, #E3C6A3: rgb(227 198 163), hsl(33 53% 76%), oklch(0.842 0.057 72.2). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Orange mean? → · October Bounty color name →
#E3C6A3
oklch(0.842 0.057 72.2)
Renk dönüşümleri
- HEX
- #e3c6a3
- RGB
- rgb(227 198 163)
- HSL
- hsl(33 53% 76%)
- HWB
- hwb(33 64% 11%)
- OKLCH
- oklch(0.842 0.057 72.2)
- OKLab
- oklab(0.842 0.017 0.054)
- CIE Lab
- lab(81.73 6.77 21.58)
- LCH
- lch(81.73 22.62 72.6)
- CMYK
- cmyk(0% 13% 28% 11%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- E6CCAC
- E9D1B5
- ECD7BE
- EEDDC8
- F1E2D1
- F4E8DA
- F7EEE3
- FAF4EC
- FCF9F6
Koyu tonlar
- C5AC8D
- A89278
- 8C7A63
- 71624F
- 574B3C
- 3F352A
- 272119
- 120E0A
- 030201
Gri tonlar
- D9BFA0
- CFB89C
- C4B199
- BAAA95
- B0A292
- A79C8E
- 9D958B
- 938E87
- 8A8784
Renk uyumları
Tamamlayıcı +180°
- E3C6A3
October Bounty
- B1CEF0
≈ Alphabet Blue
Analog -30° +30°
- E3C6A3
October Bounty
- EDC0AF
≈ Soft Orange
- D2CDA3
≈ Sawgrass Cottage
Üçlü +120° +240°
- E3C6A3
October Bounty
- A0D8D5
≈ Blue Tint
- D8C1E7
≈ York Plum
Bölünmüş tamamlayıcı +150° +210°
- E3C6A3
October Bounty
- A3D4E6
≈ Laissez-Faire
- C5C7F0
≈ Soap
Dörtlü +90° +180° +270°
- E3C6A3
October Bounty
- ABD8C0
≈ Shanghai Jade
- B1CEF0
≈ Alphabet Blue
- E7BDD6
≈ Child’s Play
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 1.63:1 · APCA Lc 28
Ag
AAASiyah üzerinde
WCAG 12.87:1 · APCA Lc 75
En iyi metin rengi: #000000
WCAG 12.87:1 (AAA) · APCA Lc 75
Contrast pairs
Kod parçacıkları
CSS
:root {
--october-bounty: #e3c6a3;
--october-bounty-rgb: 227 198 163;
--october-bounty-oklch: oklch(0.842 0.057 72.2);
}
.element {
color: var(--october-bounty);
background-color: hsl(33 53% 76%);
border-color: oklch(0.842 0.057 72.2);
}Tailwind CSS v4
@theme {
--color-october-bounty: #e3c6a3;
--color-october-bounty-50: #fff3e4;
--color-october-bounty-100: #f4e6d3;
--color-october-bounty-200: #e3d1ba;
--color-october-bounty-300: #c9b498;
--color-october-bounty-400: #b49a7a;
--color-october-bounty-500: #9e805c;
--color-october-bounty-600: #866d4e;
--color-october-bounty-700: #6b573e;
--color-october-bounty-800: #4f3f2d;
--color-october-bounty-900: #372b1e;
--color-october-bounty-950: #22190e;
}SCSS
$october-bounty: #e3c6a3;
$october-bounty-rgb: 227, 198, 163;
$october-bounty-light: mix(#fff, $october-bounty, 20%);
$october-bounty-dark: mix(#000, $october-bounty, 20%);
.element {
color: $october-bounty;
box-shadow: 0 0 0 2px rgba($october-bounty, 0.35);
}