Nazwany kolor · #776985
Amethyst Gem
Amethyst Gem to #776985: rgb(119 105 133), hsl(270 12% 47%), oklch(0.544 0.046 307.5). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Purple mean? → · Amethyst Gem color name →
#776985
oklch(0.544 0.046 307.5)
Konwersje koloru
- HEX
- #776985
- RGB
- rgb(119 105 133)
- HSL
- hsl(270 12% 47%)
- HWB
- hwb(270 41% 48%)
- OKLCH
- oklch(0.544 0.046 307.5)
- OKLab
- oklab(0.544 0.028 -0.036)
- CIE Lab
- lab(46.52 10.02 -13.45)
- LCH
- lch(46.52 16.77 306.7)
- CMYK
- cmyk(11% 21% 0% 48%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 847791
- 91859C
- 9E94A8
- ABA2B4
- B9B1C1
- C6C0CD
- D4D0D9
- E2DFE6
- F1EFF2
Odcienie ciemniejsze
- 675A73
- 574C61
- 473E50
- 383140
- 2A2430
- 1C1821
- 100C13
- 050406
- 010001
Tony
- 786B85
- 796E84
- 7A7084
- 7B7283
- 7C7583
- 7C7782
- 7D7982
- 7E7B81
- 7F7E81
Harmonie kolorów
Komplementarna +180°
- 776985
Amethyst Gem
- 687558
≈ Lignum Vitœ Foliage
Analogowa -30° +30°
- 776985
Amethyst Gem
- 696E8B
≈ Dark Prince
- 826679
≈ Arctic Dusk
Triada +120° +240°
- 776985
Amethyst Gem
- 826B53
≈ Salted Pretzel
- 507974
≈ Breaker Bay
Komplementarna rozszczepiona +150° +210°
- 776985
Amethyst Gem
- 777051
≈ Truly Olive
- 5A7865
≈ Mt Burleigh
Tetrada +90° +180° +270°
- 776985
Amethyst Gem
- 88675D
≈ Nut Brown
- 687558
≈ Lignum Vitœ Foliage
- 517782
≈ Ocean Current
Kontrast i dostępność
Ag
AANa bieli
WCAG 5.06:1 · APCA Lc 75
Ag
FailNa czerni
WCAG 4.14:1 · APCA Lc 27
Najlepszy kolor tekstu: #FFFFFF
WCAG 5.06:1 (AA) · APCA Lc 75
Contrast pairs
Fragmenty kodu
CSS
:root {
--amethyst-gem: #776985;
--amethyst-gem-rgb: 119 105 133;
--amethyst-gem-oklch: oklch(0.544 0.046 307.5);
}
.element {
color: var(--amethyst-gem);
background-color: hsl(270 12% 47%);
border-color: oklch(0.544 0.046 307.5);
}Tailwind CSS v4
@theme {
--color-amethyst-gem: #776985;
--color-amethyst-gem-50: #f9f2ff;
--color-amethyst-gem-100: #ece4f4;
--color-amethyst-gem-200: #dacfe3;
--color-amethyst-gem-300: #beb1ca;
--color-amethyst-gem-400: #a698b4;
--color-amethyst-gem-500: #8e7e9e;
--color-amethyst-gem-600: #786b86;
--color-amethyst-gem-700: #60566b;
--color-amethyst-gem-800: #463e4f;
--color-amethyst-gem-900: #302b37;
--color-amethyst-gem-950: #1d1822;
}SCSS
$amethyst-gem: #776985;
$amethyst-gem-rgb: 119, 105, 133;
$amethyst-gem-light: mix(#fff, $amethyst-gem, 20%);
$amethyst-gem-dark: mix(#000, $amethyst-gem, 20%);
.element {
color: $amethyst-gem;
box-shadow: 0 0 0 2px rgba($amethyst-gem, 0.35);
}