Nazwany kolor · #CBB49A
Bittersweet Stem
Bittersweet Stem to #CBB49A: rgb(203 180 154), hsl(32 32% 70%), oklch(0.783 0.044 70.5). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Orange mean? → · Bittersweet Stem color name →
#CBB49A
oklch(0.783 0.044 70.5)
Konwersje koloru
- HEX
- #cbb49a
- RGB
- rgb(203 180 154)
- HSL
- hsl(32 32% 70%)
- HWB
- hwb(32 60% 20%)
- OKLCH
- oklch(0.783 0.044 70.5)
- OKLab
- oklab(0.783 0.015 0.042)
- CIE Lab
- lab(74.8 5.54 16.5)
- LCH
- lch(74.8 17.4 71.4)
- CMYK
- cmyk(0% 11% 24% 20%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- D0BBA4
- D5C3AE
- DBCAB8
- E0D2C2
- E5D9CC
- EAE1D6
- EFE8E0
- F5F0EA
- FAF7F5
Odcienie ciemniejsze
- B09C85
- 968571
- 7D6E5E
- 65584B
- 4D4439
- 373027
- 221D17
- 0F0C09
- 020201
Tony
- C3AF97
- BCA995
- B4A492
- AC9F90
- A59A8D
- 9D958B
- 968F88
- 8F8A85
- 878583
Harmonie kolorów
Komplementarna +180°
- CBB49A
Bittersweet Stem
- A4BBD4
≈ Sky Pilot
Analogowa -30° +30°
- CBB49A
Bittersweet Stem
- D2AFA3
≈ Rose Smoke
- BEBA99
≈ Salty Seeds
Triada +120° +240°
- CBB49A
Bittersweet Stem
- 98C2BF
≈ Pitter Patter
- C1B1CE
≈ Vintage Bloom
Komplementarna rozszczepiona +150° +210°
- CBB49A
Bittersweet Stem
- 9ABFCC
≈ Rest Assured
- B2B6D5
≈ Hundred Waters
Tetrada +90° +180° +270°
- CBB49A
Bittersweet Stem
- A0C2AF
≈ Green Silk
- A4BBD4
≈ Sky Pilot
- CDAEC1
≈ Winsome Orchid
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.99:1 · APCA Lc 39
Ag
AAANa czerni
WCAG 10.53:1 · APCA Lc 64
Najlepszy kolor tekstu: #000000
WCAG 10.53:1 (AAA) · APCA Lc 64
Contrast pairs
Fragmenty kodu
CSS
:root {
--bittersweet-stem: #cbb49a;
--bittersweet-stem-rgb: 203 180 154;
--bittersweet-stem-oklch: oklch(0.783 0.044 70.5);
}
.element {
color: var(--bittersweet-stem);
background-color: hsl(32 32% 70%);
border-color: oklch(0.783 0.044 70.5);
}Tailwind CSS v4
@theme {
--color-bittersweet-stem: #cbb49a;
--color-bittersweet-stem-50: #fdf3e8;
--color-bittersweet-stem-100: #f1e6d8;
--color-bittersweet-stem-200: #e0d2c0;
--color-bittersweet-stem-300: #c6b49f;
--color-bittersweet-stem-400: #b09a82;
--color-bittersweet-stem-500: #998266;
--color-bittersweet-stem-600: #826e57;
--color-bittersweet-stem-700: #685845;
--color-bittersweet-stem-800: #4d4032;
--color-bittersweet-stem-900: #352c22;
--color-bittersweet-stem-950: #201911;
}SCSS
$bittersweet-stem: #cbb49a;
$bittersweet-stem-rgb: 203, 180, 154;
$bittersweet-stem-light: mix(#fff, $bittersweet-stem, 20%);
$bittersweet-stem-dark: mix(#000, $bittersweet-stem, 20%);
.element {
color: $bittersweet-stem;
box-shadow: 0 0 0 2px rgba($bittersweet-stem, 0.35);
}