Adlandırılmış renk · #563C0D
Pineapple
Pineapple, #563C0D: rgb(86 60 13), hsl(39 74% 19%), oklch(0.377 0.07 77.6). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Brown mean? → · Pineapple color name →
#563C0D
oklch(0.377 0.07 77.6)
Renk dönüşümleri
- HEX
- #563c0d
- RGB
- rgb(86 60 13)
- HSL
- hsl(39 74% 19%)
- HWB
- hwb(39 5% 66%)
- OKLCH
- oklch(0.377 0.07 77.6)
- OKLab
- oklab(0.377 0.015 0.069)
- CIE Lab
- lab(27.67 8.31 31.67)
- LCH
- lch(27.67 32.75 75.3)
- CMYK
- cmyk(0% 30% 85% 66%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- 664E27
- 76603E
- 867255
- 96856C
- A79983
- B8AC9B
- CAC0B3
- DBD5CC
- EDEAE5
Koyu tonlar
- 4A330A
- 3E2A07
- 322105
- 271903
- 1C1102
- 120A01
- 080400
- 020100
- 000000
Gri tonlar
- 5A431C
- 5F4928
- 635034
- 67573F
- 6B5E4A
- 6F6454
- 746B5F
- 78726A
- 7C7975
Renk uyumları
Tamamlayıcı +180°
- 563C0D
Pineapple
- 294266
≈ Black Turmeric
Analog -30° +30°
- 563C0D
Pineapple
- 5F351E
≈ Chubby Chocolate
- 464410
≈ Alligator Gladiator
Üçlü +120° +240°
- 563C0D
Pineapple
- 004C4D
≈ Dark Teal
- 51355A
≈ Blackberry Cordial
Bölünmüş tamamlayıcı +150° +210°
- 563C0D
Pineapple
- 06485F
≈ Stegadon Scale Green
- 403B65
≈ Storm Is Coming
Dörtlü +90° +180° +270°
Kontrast ve erişilebilirlik
Ag
AAABeyaz üzerinde
WCAG 10.25:1 · APCA Lc 94
Ag
FailSiyah üzerinde
WCAG 2.04:1 · APCA Lc 9
En iyi metin rengi: #FFFFFF
WCAG 10.25:1 (AAA) · APCA Lc 94
Contrast pairs
Kod parçacıkları
CSS
:root {
--pineapple: #563c0d;
--pineapple-rgb: 86 60 13;
--pineapple-oklch: oklch(0.377 0.07 77.6);
}
.element {
color: var(--pineapple);
background-color: hsl(39 74% 19%);
border-color: oklch(0.377 0.07 77.6);
}Tailwind CSS v4
@theme {
--color-pineapple: #563c0d;
--color-pineapple-50: #fff3df;
--color-pineapple-100: #f5e6ce;
--color-pineapple-200: #e5d1b3;
--color-pineapple-300: #cbb48f;
--color-pineapple-400: #b69a6f;
--color-pineapple-500: #a0804f;
--color-pineapple-600: #876d43;
--color-pineapple-700: #6d5735;
--color-pineapple-800: #513f26;
--color-pineapple-900: #382b19;
--color-pineapple-950: #23190a;
}SCSS
$pineapple: #563c0d;
$pineapple-rgb: 86, 60, 13;
$pineapple-light: mix(#fff, $pineapple, 20%);
$pineapple-dark: mix(#000, $pineapple, 20%);
.element {
color: $pineapple;
box-shadow: 0 0 0 2px rgba($pineapple, 0.35);
}