Nazwany kolor · #958D45
Retro Avocado
Retro Avocado to #958D45: rgb(149 141 69), hsl(54 37% 43%), oklch(0.635 0.094 103). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Yellow mean? → · Retro Avocado color name →
#958D45
oklch(0.635 0.094 103)
Konwersje koloru
- HEX
- #958d45
- RGB
- rgb(149 141 69)
- HSL
- hsl(54 37% 43%)
- HWB
- hwb(54 27% 42%)
- OKLCH
- oklch(0.635 0.094 103)
- OKLab
- oklab(0.635 -0.021 0.092)
- CIE Lab
- lab(58.17 -4.25 38.95)
- LCH
- lch(58.17 39.18 96.2)
- CMYK
- cmyk(0% 5% 54% 42%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 9F9859
- A9A36B
- B3AE7E
- BEBA90
- C8C5A2
- D3D1B5
- DEDCC7
- E9E8DA
- F4F3EC
Odcienie ciemniejsze
- 817A3B
- 6D6731
- 5A5527
- 48441E
- 373315
- 26230C
- 161405
- 080702
- 010100
Tony
- 938C4D
- 918B54
- 8E895A
- 8C8860
- 8A8766
- 88866C
- 868471
- 848376
- 82817B
Harmonie kolorów
Komplementarna +180°
- 958D45
Retro Avocado
- 8283C2
≈ Twilight Twinkle
Analogowa -30° +30°
- 958D45
Retro Avocado
- AD8146
≈ Bungalow Gold
- 74975B
≈ Dry Moss
Triada +120° +240°
- 958D45
Retro Avocado
- 3E97B4
≈ Enchanted Well
- B2739A
≈ So Long Shadow
Komplementarna rozszczepiona +150° +210°
- 958D45
Retro Avocado
- 608EC2
≈ Cobalt Glow
- 9F79B3
≈ English Lavender
Tetrada +90° +180° +270°
- 958D45
Retro Avocado
- 329C9A
≈ Latigo Bay
- 8283C2
≈ Twilight Twinkle
- BC727A
≈ Rita’s Rouge
Kontrast i dostępność
Ag
FailNa bieli
WCAG 3.40:1 · APCA Lc 61
Ag
AANa czerni
WCAG 6.17:1 · APCA Lc 40
Najlepszy kolor tekstu: #000000
WCAG 6.17:1 (AA) · APCA Lc 40
Contrast pairs
Fragmenty kodu
CSS
:root {
--retro-avocado: #958d45;
--retro-avocado-rgb: 149 141 69;
--retro-avocado-oklch: oklch(0.635 0.094 103);
}
.element {
color: var(--retro-avocado);
background-color: hsl(54 37% 43%);
border-color: oklch(0.635 0.094 103);
}Tailwind CSS v4
@theme {
--color-retro-avocado: #958d45;
--color-retro-avocado-50: #f9f7d9;
--color-retro-avocado-100: #eceac6;
--color-retro-avocado-200: #dad7a9;
--color-retro-avocado-300: #bebb82;
--color-retro-avocado-400: #a8a15d;
--color-retro-avocado-500: #928936;
--color-retro-avocado-600: #7b7430;
--color-retro-avocado-700: #635c26;
--color-retro-avocado-800: #494319;
--color-retro-avocado-900: #332e10;
--color-retro-avocado-950: #1f1b03;
}SCSS
$retro-avocado: #958d45;
$retro-avocado-rgb: 149, 141, 69;
$retro-avocado-light: mix(#fff, $retro-avocado, 20%);
$retro-avocado-dark: mix(#000, $retro-avocado, 20%);
.element {
color: $retro-avocado;
box-shadow: 0 0 0 2px rgba($retro-avocado, 0.35);
}