Benannte Farbe · #9A8EC1
Hermosa
Hermosa ist #9A8EC1: rgb(154 142 193), hsl(254 29% 66%), oklch(0.676 0.075 295.1). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Purple mean? → · Hermosa color name →
#9A8EC1
oklch(0.676 0.075 295.1)
Farbumrechnungen
- HEX
- #9a8ec1
- RGB
- rgb(154 142 193)
- HSL
- hsl(254 29% 66%)
- HWB
- hwb(254 56% 24%)
- OKLCH
- oklch(0.676 0.075 295.1)
- OKLab
- oklab(0.676 0.032 -0.068)
- CIE Lab
- lab(61.49 12.64 -25)
- LCH
- lch(61.49 28.02 296.8)
- CMYK
- cmyk(20% 26% 0% 24%)
Tints · Shades · Tones
Tints
- A499C7
- ADA4CE
- B7AFD4
- C1BADA
- CBC5E0
- D5D1E7
- E0DCED
- EAE8F3
- F4F3F9
Shades
- 857BA7
- 71688F
- 5E5677
- 4B445F
- 393449
- 272434
- 171520
- 09070E
- 010102
Tones
- 978DBA
- 958BB4
- 928AAD
- 8F89A7
- 8D87A0
- 8A869A
- 888494
- 85838D
- 828287
Farbharmonien
Komplementär +180°
- 9A8EC1
Hermosa
- 959D66
≈ Reptilian Leader
Analog -30° +30°
- 9A8EC1
Hermosa
- 8097C6
≈ Blue Hyacinth
- AF87B1
≈ African Violet
Triadisch +120° +240°
- 9A8EC1
Hermosa
- BC8B6A
≈ Fenugreek
- 62A694
≈ Polished Pine
Geteilt komplementär +150° +210°
- 9A8EC1
Hermosa
- AC9460
≈ Pyrite Gold
- 7AA47A
≈ Jadesheen
Tetradisch +90° +180° +270°
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 2.99:1 · APCA Lc 57
Ag
AAAAuf Schwarz
WCAG 7.01:1 · APCA Lc 45
Beste Textfarbe: #000000
WCAG 7.01:1 (AAA) · APCA Lc 45
Contrast pairs
Code-Snippets
CSS
:root {
--hermosa: #9a8ec1;
--hermosa-rgb: 154 142 193;
--hermosa-oklch: oklch(0.676 0.075 295.1);
}
.element {
color: var(--hermosa);
background-color: hsl(254 29% 66%);
border-color: oklch(0.676 0.075 295.1);
}Tailwind CSS v4
@theme {
--color-hermosa: #9a8ec1;
--color-hermosa-50: #f7f1ff;
--color-hermosa-100: #eae3ff;
--color-hermosa-200: #d7cef1;
--color-hermosa-300: #bbb0da;
--color-hermosa-400: #a196c7;
--color-hermosa-500: #8a7cb3;
--color-hermosa-600: #746997;
--color-hermosa-700: #5d5479;
--color-hermosa-800: #433d5a;
--color-hermosa-900: #2e2a3f;
--color-hermosa-950: #1b1828;
}SCSS
$hermosa: #9a8ec1;
$hermosa-rgb: 154, 142, 193;
$hermosa-light: mix(#fff, $hermosa, 20%);
$hermosa-dark: mix(#000, $hermosa, 20%);
.element {
color: $hermosa;
box-shadow: 0 0 0 2px rgba($hermosa, 0.35);
}