Najbliższy nazwany kolor · #846A45
#846A45
Najbliższy nazwany kolor: Sneaky Sesame
#846A45 (rgb(132 106 69), hsl(35 31% 39%), oklch(0.541 0.062 75.6)) jest najbliższy nazwanemu kolorowi Sneaky Sesame. Zobacz odcienie, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
#846A45
oklch(0.541 0.062 75.6)
Konwersje koloru
- HEX
- #846a45
- RGB
- rgb(132 106 69)
- HSL
- hsl(35 31% 39%)
- HWB
- hwb(35 27% 48%)
- OKLCH
- oklch(0.541 0.062 75.6)
- OKLab
- oklab(0.541 0.015 0.06)
- CIE Lab
- lab(46.75 6.92 24.84)
- LCH
- lch(46.75 25.79 74.4)
- CMYK
- cmyk(0% 20% 48% 48%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 907857
- 9C8668
- A8957A
- B4A38D
- C0B29F
- CCC1B2
- D9D0C5
- E6E0D8
- F2EFEB
Odcienie ciemniejsze
- 725B3B
- 604D31
- 4F3F27
- 3F311E
- 2F2415
- 20180C
- 120D05
- 060402
- 010000
Tony
- 846C4B
- 836F52
- 837158
- 83735E
- 827563
- 827769
- 827A6F
- 817C75
- 817E7A
Harmonie kolorów
Komplementarna +180°
- 846A45
Sneaky Sesame
- 577193
≈ Blue Jacket
Analogowa -30° +30°
- 846A45
Sneaky Sesame
- 8E6450
≈ Gaboon Viper
- 747146
≈ Vineyard View
Triada +120° +240°
- 846A45
Sneaky Sesame
- 3F7A7A
≈ Faded Jade
- 7D6488
≈ Matriarch
Komplementarna rozszczepiona +150° +210°
- 846A45
Sneaky Sesame
- 45778A
≈ Majestic Mountain
- 6B6A92
≈ Wild Wisteria
Tetrada +90° +180° +270°
- 846A45
Sneaky Sesame
- 4A7B66
≈ Leaping Lizard
- 577193
≈ Blue Jacket
- 8A6077
≈ Victorian Plum
Kontrast i dostępność
Ag
AANa bieli
WCAG 5.08:1 · APCA Lc 75
Ag
FailNa czerni
WCAG 4.12:1 · APCA Lc 27
Najlepszy kolor tekstu: #FFFFFF
WCAG 5.08:1 (AA) · APCA Lc 75
Contrast pairs
Fragmenty kodu
CSS
:root {
--sneaky-sesame: #846a45;
--sneaky-sesame-rgb: 132 106 69;
--sneaky-sesame-oklch: oklch(0.541 0.062 75.6);
}
.element {
color: var(--sneaky-sesame);
background-color: hsl(35 31% 39%);
border-color: oklch(0.541 0.062 75.6);
}Tailwind CSS v4
@theme {
--color-sneaky-sesame: #846a45;
--color-sneaky-sesame-50: #fff3e2;
--color-sneaky-sesame-100: #f4e6d1;
--color-sneaky-sesame-200: #e3d2b7;
--color-sneaky-sesame-300: #c9b494;
--color-sneaky-sesame-400: #b49a75;
--color-sneaky-sesame-500: #9e8157;
--color-sneaky-sesame-600: #866d4a;
--color-sneaky-sesame-700: #6b573b;
--color-sneaky-sesame-800: #4f3f2a;
--color-sneaky-sesame-900: #372c1c;
--color-sneaky-sesame-950: #22190c;
}SCSS
$sneaky-sesame: #846a45;
$sneaky-sesame-rgb: 132, 106, 69;
$sneaky-sesame-light: mix(#fff, $sneaky-sesame, 20%);
$sneaky-sesame-dark: mix(#000, $sneaky-sesame, 20%);
.element {
color: $sneaky-sesame;
box-shadow: 0 0 0 2px rgba($sneaky-sesame, 0.35);
}