Nazwany kolor · #B7A083
Craft Brown
Craft Brown to #B7A083: rgb(183 160 131), hsl(33 27% 62%), oklch(0.718 0.049 73.3). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Orange mean? → · Craft Brown color name →
#B7A083
oklch(0.718 0.049 73.3)
Konwersje koloru
- HEX
- #b7a083
- RGB
- rgb(183 160 131)
- HSL
- hsl(33 27% 62%)
- HWB
- hwb(33 51% 28%)
- OKLCH
- oklch(0.718 0.049 73.3)
- OKLab
- oklab(0.718 0.014 0.046)
- CIE Lab
- lab(67.36 5.43 18.45)
- LCH
- lch(67.36 19.23 73.6)
- CMYK
- cmyk(0% 13% 28% 28%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- BEA98F
- C5B29B
- CCBCA7
- D4C5B3
- DBCFC0
- E2D8CC
- E9E2D9
- F0EBE5
- F8F5F2
Odcienie ciemniejsze
- 9F8B71
- 877660
- 70614F
- 5A4E3F
- 453B2F
- 312920
- 1E1912
- 0C0906
- 020101
Tony
- B19D83
- AC9A83
- A69683
- A19382
- 9B9082
- 968D82
- 908A81
- 8B8681
- 858380
Harmonie kolorów
Komplementarna +180°
- B7A083
Craft Brown
- 8FA6C2
≈ Frills
Analogowa -30° +30°
- B7A083
Craft Brown
- BF9B8C
≈ Coquina Shell
- A9A683
≈ Neutral Green
Triada +120° +240°
- B7A083
Craft Brown
- 81AEAD
≈ Galaxy Green
- AF9CBA
≈ Purple Springs
Komplementarna rozszczepiona +150° +210°
- B7A083
Craft Brown
- 83ABBB
≈ Summerhouse Blue
- 9FA1C2
≈ Ruffled Iris
Tetrada +90° +180° +270°
- B7A083
Craft Brown
- 89AE9C
≈ Corsican
- 8FA6C2
≈ Frills
- BB99AC
≈ Classy Mauve
Kontrast i dostępność
Ag
FailNa bieli
WCAG 2.50:1 · APCA Lc 49
Ag
AAANa czerni
WCAG 8.36:1 · APCA Lc 53
Najlepszy kolor tekstu: #000000
WCAG 8.36:1 (AAA) · APCA Lc 53
Contrast pairs
Fragmenty kodu
CSS
:root {
--craft-brown: #b7a083;
--craft-brown-rgb: 183 160 131;
--craft-brown-oklch: oklch(0.718 0.049 73.3);
}
.element {
color: var(--craft-brown);
background-color: hsl(33 27% 62%);
border-color: oklch(0.718 0.049 73.3);
}Tailwind CSS v4
@theme {
--color-craft-brown: #b7a083;
--color-craft-brown-50: #fef4e6;
--color-craft-brown-100: #f2e6d6;
--color-craft-brown-200: #e1d2be;
--color-craft-brown-300: #c6b49c;
--color-craft-brown-400: #b09b7f;
--color-craft-brown-500: #9a8262;
--color-craft-brown-600: #826e54;
--color-craft-brown-700: #685843;
--color-craft-brown-800: #4d4030;
--color-craft-brown-900: #362c20;
--color-craft-brown-950: #211910;
}SCSS
$craft-brown: #b7a083;
$craft-brown-rgb: 183, 160, 131;
$craft-brown-light: mix(#fff, $craft-brown, 20%);
$craft-brown-dark: mix(#000, $craft-brown, 20%);
.element {
color: $craft-brown;
box-shadow: 0 0 0 2px rgba($craft-brown, 0.35);
}