Benannte Farbe · #7A9595
North Cape Grey
North Cape Grey ist #7A9595: rgb(122 149 149), hsl(180 11% 53%), oklch(0.649 0.03 196.4). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Gray mean? → · North Cape Grey color name →
#7A9595
oklch(0.649 0.03 196.4)
Farbumrechnungen
- HEX
- #7a9595
- RGB
- rgb(122 149 149)
- HSL
- hsl(180 11% 53%)
- HWB
- hwb(180 48% 42%)
- OKLCH
- oklch(0.649 0.03 196.4)
- OKLab
- oklab(0.649 -0.029 -0.009)
- CIE Lab
- lab(59.61 -9.84 -3.33)
- LCH
- lch(59.61 10.39 198.7)
- CMYK
- cmyk(18% 0% 0% 42%)
Tints · Shades · Tones
Tints
- 879F9F
- 94A9A9
- A1B4B4
- AEBEBE
- BBC9C9
- C8D3D3
- D6DEDE
- E3E9E9
- F1F4F4
Shades
- 698181
- 596D6D
- 495A5A
- 3A4848
- 2B3737
- 1D2626
- 101616
- 050808
- 010101
Tones
- 7B9393
- 7C9191
- 7C8F8F
- 7D8D8D
- 7D8B8A
- 7E8888
- 7F8686
- 7F8484
- 808282
Farbharmonien
Komplementär +180°
- 7A9595
North Cape Grey
- A18888
≈ Rosaline Pearl
Analog -30° +30°
- 7A9595
North Cape Grey
- 7E958B
≈ Azores
- 7C939D
≈ Inland Waters
Triadisch +120° +240°
- 7A9595
North Cape Grey
- 968A9C
≈ Eccentricity
- 9A8D7B
≈ Light Khaki
Geteilt komplementär +150° +210°
- 7A9595
North Cape Grey
- 9E8893
≈ Art Nouveau Violet
- 9F8A80
≈ Aspiration
Tetradisch +90° +180° +270°
- 7A9595
North Cape Grey
- 8D8DA1
≈ Violet Verbena
- A18888
≈ Rosaline Pearl
- 91907B
≈ Farmer’s Market
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 3.20:1 · APCA Lc 59
Ag
AAAuf Schwarz
WCAG 6.56:1 · APCA Lc 43
Beste Textfarbe: #000000
WCAG 6.56:1 (AA) · APCA Lc 43
Contrast pairs
Code-Snippets
CSS
:root {
--north-cape-grey: #7a9595;
--north-cape-grey-rgb: 122 149 149;
--north-cape-grey-oklch: oklch(0.649 0.03 196.4);
}
.element {
color: var(--north-cape-grey);
background-color: hsl(180 11% 53%);
border-color: oklch(0.649 0.03 196.4);
}Tailwind CSS v4
@theme {
--color-north-cape-grey: #7a9595;
--color-north-cape-grey-50: #ecf8f8;
--color-north-cape-grey-100: #ddebeb;
--color-north-cape-grey-200: #c6d8d9;
--color-north-cape-grey-300: #a6bcbd;
--color-north-cape-grey-400: #8aa4a4;
--color-north-cape-grey-500: #6f8d8d;
--color-north-cape-grey-600: #5e7777;
--color-north-cape-grey-700: #4b5f5f;
--color-north-cape-grey-800: #364645;
--color-north-cape-grey-900: #253030;
--color-north-cape-grey-950: #141d1c;
}SCSS
$north-cape-grey: #7a9595;
$north-cape-grey-rgb: 122, 149, 149;
$north-cape-grey-light: mix(#fff, $north-cape-grey, 20%);
$north-cape-grey-dark: mix(#000, $north-cape-grey, 20%);
.element {
color: $north-cape-grey;
box-shadow: 0 0 0 2px rgba($north-cape-grey, 0.35);
}