Najbliższy nazwany kolor · #AFA991
#AFA991
Najbliższy nazwany kolor: Humble Hippo
#AFA991 (rgb(175 169 145), hsl(48 16% 63%), oklch(0.733 0.034 95.5)) jest najbliższy nazwanemu kolorowi Humble Hippo. Zobacz odcienie, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
#AFA991
oklch(0.733 0.034 95.5)
Konwersje koloru
- HEX
- #afa991
- RGB
- rgb(175 169 145)
- HSL
- hsl(48 16% 63%)
- HWB
- hwb(48 57% 31%)
- OKLCH
- oklch(0.733 0.034 95.5)
- OKLab
- oklab(0.733 -0.003 0.034)
- CIE Lab
- lab(69.25 -0.81 13.26)
- LCH
- lch(69.25 13.28 93.5)
- CMYK
- cmyk(0% 3% 17% 31%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- B7B19C
- BFBAA6
- C6C2B1
- CECBBC
- D6D3C7
- DEDCD2
- E6E5DD
- EFEDE8
- F7F6F4
Odcienie ciemniejsze
- 98927D
- 817C6A
- 6B6758
- 565346
- 413F35
- 2E2C25
- 1C1B15
- 0B0A07
- 010101
Tony
- AAA58F
- A5A18E
- A19D8C
- 9C988A
- 979489
- 929087
- 8E8C85
- 898884
- 858482
Harmonie kolorów
Komplementarna +180°
- AFA991
Humble Hippo
- A2A7BF
≈ Icelandic Blue
Analogowa -30° +30°
- AFA991
Humble Hippo
- B8A593
≈ Tavern
- A3AD96
≈ Garden
Triada +120° +240°
- AFA991
Humble Hippo
- 91AFB6
≈ Mountain Stream
- B7A1B1
≈ Parlour Rose
Komplementarna rozszczepiona +150° +210°
- AFA991
Humble Hippo
- 98ABBD
≈ Lead Ore
- AEA4BA
≈ Decanter
Tetrada +90° +180° +270°
- AFA991
Humble Hippo
- 91B0AC
≈ Undersea
- A2A7BF
≈ Icelandic Blue
- BDA0A5
≈ Tourmaline Mauve
Kontrast i dostępność
Ag
FailNa bieli
WCAG 2.35:1 · APCA Lc 46
Ag
AAANa czerni
WCAG 8.90:1 · APCA Lc 56
Najlepszy kolor tekstu: #000000
WCAG 8.90:1 (AAA) · APCA Lc 56
Contrast pairs
Fragmenty kodu
CSS
:root {
--humble-hippo: #afa991;
--humble-hippo-rgb: 175 169 145;
--humble-hippo-oklch: oklch(0.733 0.034 95.5);
}
.element {
color: var(--humble-hippo);
background-color: hsl(48 16% 63%);
border-color: oklch(0.733 0.034 95.5);
}Tailwind CSS v4
@theme {
--color-humble-hippo: #afa991;
--color-humble-hippo-50: #f8f5eb;
--color-humble-hippo-100: #ebe8dc;
--color-humble-hippo-200: #d8d5c4;
--color-humble-hippo-300: #bcb8a4;
--color-humble-hippo-400: #a49f88;
--color-humble-hippo-500: #8d866d;
--color-humble-hippo-600: #77725c;
--color-humble-hippo-700: #5f5b4a;
--color-humble-hippo-800: #464235;
--color-humble-hippo-900: #312e24;
--color-humble-hippo-950: #1d1b13;
}SCSS
$humble-hippo: #afa991;
$humble-hippo-rgb: 175, 169, 145;
$humble-hippo-light: mix(#fff, $humble-hippo, 20%);
$humble-hippo-dark: mix(#000, $humble-hippo, 20%);
.element {
color: $humble-hippo;
box-shadow: 0 0 0 2px rgba($humble-hippo, 0.35);
}