Nearest named color · #6F776F
#6F776F
Nearest named color: Camping Trip
#6F776F (rgb(111 119 111), hsl(120 3% 45%), oklch(0.56 0.015 145.4)) is closest to the named color Camping Trip. See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
#6F776F
oklch(0.56 0.015 145.4)
Color conversions
- HEX
- #6f776f
- RGB
- rgb(111 119 111)
- HSL
- hsl(120 3% 45%)
- HWB
- hwb(120 44% 53%)
- OKLCH
- oklch(0.56 0.015 145.4)
- OKLab
- oklab(0.56 -0.013 0.009)
- CIE Lab
- lab(49.16 -4.35 3.33)
- LCH
- lch(49.16 5.47 142.6)
- CMYK
- cmyk(7% 0% 7% 53%)
Tints · Shades · Tones
Tints
- 7C847C
- 8A918A
- 989E98
- A6ABA6
- B4B9B4
- C3C6C3
- D2D4D2
- E1E2E1
- F0F1F0
Shades
- 606760
- 515751
- 424742
- 343834
- 272A27
- 1A1C1A
- 0E100E
- 040504
- 010101
Tones
- 717871
- 727972
- 747A74
- 767B76
- 777C77
- 797C79
- 7B7D7B
- 7D7E7D
- 7E7F7E
Color harmonies
Complementary +180°
- 6F776F
Camping Trip
- 797179
≈ Cement Feet
Analogous -30° +30°
- 6F776F
Camping Trip
- 74766C
≈ Sugar Pine
- 6C7874
≈ Victorian Tapestry
Triadic +120° +240°
- 6F776F
Camping Trip
- 70747E
≈ Spitsbergen Blue
- 7D7170
≈ Sophomore
Split-complementary +150° +210°
- 6F776F
Camping Trip
- 75737D
≈ Dried Lavender Flowers
- 7C7175
≈ Empress
Tetradic +90° +180° +270°
- 6F776F
Camping Trip
- 6C767C
≈ Pompeii Ash
- 797179
≈ Cement Feet
- 7C726C
≈ Moroccan Brown
Contrast & accessibility
Ag
AAOn white
WCAG 4.62:1 · APCA Lc 72
Ag
AAOn black
WCAG 4.54:1 · APCA Lc 30
Best text color: #FFFFFF
WCAG 4.62:1 (AA) · APCA Lc 72
Contrast pairs
Code snippets
CSS
:root {
--camping-trip: #6f776f;
--camping-trip-rgb: 111 119 111;
--camping-trip-oklch: oklch(0.56 0.015 145.4);
}
.element {
color: var(--camping-trip);
background-color: hsl(120 3% 45%);
border-color: oklch(0.56 0.015 145.4);
}Tailwind CSS v4
@theme {
--color-camping-trip: #6f776f;
--color-camping-trip-50: #f2f6f3;
--color-camping-trip-100: #e5e9e5;
--color-camping-trip-200: #d0d6d0;
--color-camping-trip-300: #b2bab3;
--color-camping-trip-400: #99a199;
--color-camping-trip-500: #808980;
--color-camping-trip-600: #6c746c;
--color-camping-trip-700: #575d57;
--color-camping-trip-800: #3f443f;
--color-camping-trip-900: #2c2f2b;
--color-camping-trip-950: #191b19;
}SCSS
$camping-trip: #6f776f;
$camping-trip-rgb: 111, 119, 111;
$camping-trip-light: mix(#fff, $camping-trip, 20%);
$camping-trip-dark: mix(#000, $camping-trip, 20%);
.element {
color: $camping-trip;
box-shadow: 0 0 0 2px rgba($camping-trip, 0.35);
}