Nazwany kolor · #BB9351
Maple Syrup
Maple Syrup to #BB9351: rgb(187 147 81), hsl(37 44% 53%), oklch(0.687 0.097 78.5). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Orange mean? → · Maple Syrup color name →
#BB9351
oklch(0.687 0.097 78.5)
Konwersje koloru
- HEX
- #bb9351
- RGB
- rgb(187 147 81)
- HSL
- hsl(37 44% 53%)
- HWB
- hwb(37 32% 27%)
- OKLCH
- oklch(0.687 0.097 78.5)
- OKLab
- oklab(0.687 0.019 0.095)
- CIE Lab
- lab(63.73 9.86 40.51)
- LCH
- lch(63.73 41.69 76.3)
- CMYK
- cmyk(0% 21% 57% 27%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- C29E63
- C9A875
- D0B386
- D6BE98
- DDC9A9
- E4D3BA
- EBDECB
- F2E9DC
- F8F4EE
Odcienie ciemniejsze
- A27F45
- 8A6C3A
- 73592F
- 5C4724
- 46361A
- 322510
- 1F1607
- 0D0802
- 020100
Tony
- B59157
- AF905D
- A98E62
- A38C67
- 9D8A6C
- 988870
- 928675
- 8C8479
- 86827C
Harmonie kolorów
Komplementarna +180°
- BB9351
Maple Syrup
- 759CD6
≈ Ice Blue
Analogowa -30° +30°
- BB9351
Maple Syrup
- CB8864
≈ Escalope
- 9F9F55
≈ Garden of Earthly Delights
Triada +120° +240°
- BB9351
Maple Syrup
- 40ADB1
≈ Pluto
- B487C1
≈ Creeping Bellflower
Komplementarna rozszczepiona +150° +210°
- BB9351
Maple Syrup
- 52A6CA
≈ Estero Sky
- 9891D3
≈ Portage
Tetrada +90° +180° +270°
- BB9351
Maple Syrup
- 56AE8F
≈ O’grady Green
- 759CD6
≈ Ice Blue
- C781A4
≈ Moonlight Mauve
Kontrast i dostępność
Ag
FailNa bieli
WCAG 2.83:1 · APCA Lc 54
Ag
AAANa czerni
WCAG 7.40:1 · APCA Lc 48
Najlepszy kolor tekstu: #000000
WCAG 7.40:1 (AAA) · APCA Lc 48
Contrast pairs
Fragmenty kodu
CSS
:root {
--maple-syrup: #bb9351;
--maple-syrup-rgb: 187 147 81;
--maple-syrup-oklch: oklch(0.687 0.097 78.5);
}
.element {
color: var(--maple-syrup);
background-color: hsl(37 44% 53%);
border-color: oklch(0.687 0.097 78.5);
}Tailwind CSS v4
@theme {
--color-maple-syrup: #bb9351;
--color-maple-syrup-50: #fff3d7;
--color-maple-syrup-100: #f9e5c4;
--color-maple-syrup-200: #ead1a6;
--color-maple-syrup-300: #d1b37e;
--color-maple-syrup-400: #be985a;
--color-maple-syrup-500: #a97e31;
--color-maple-syrup-600: #8f6a2b;
--color-maple-syrup-700: #725522;
--color-maple-syrup-800: #553d17;
--color-maple-syrup-900: #3c2a0f;
--color-maple-syrup-950: #251803;
}SCSS
$maple-syrup: #bb9351;
$maple-syrup-rgb: 187, 147, 81;
$maple-syrup-light: mix(#fff, $maple-syrup, 20%);
$maple-syrup-dark: mix(#000, $maple-syrup, 20%);
.element {
color: $maple-syrup;
box-shadow: 0 0 0 2px rgba($maple-syrup, 0.35);
}