Adlandırılmış renk · #8E85A7
Purple Hills
Purple Hills, #8E85A7: rgb(142 133 167), hsl(256 16% 59%), oklch(0.637 0.051 297). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Purple mean? → · Purple Hills color name →
#8E85A7
oklch(0.637 0.051 297)
Renk dönüşümleri
- HEX
- #8e85a7
- RGB
- rgb(142 133 167)
- HSL
- hsl(256 16% 59%)
- HWB
- hwb(256 52% 35%)
- OKLCH
- oklch(0.637 0.051 297)
- OKLab
- oklab(0.637 0.023 -0.046)
- CIE Lab
- lab(57.25 8.78 -16.85)
- LCH
- lch(57.25 19 297.5)
- CMYK
- cmyk(15% 20% 0% 35%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- 9991B0
- A49CB8
- AEA8C1
- BAB4CA
- C5C0D3
- D0CDDB
- DCD9E4
- E7E6ED
- F3F2F6
Koyu tonlar
- 7B7391
- 68617B
- 565066
- 444052
- 34303E
- 24212C
- 15131A
- 07060A
- 010101
Gri tonlar
- 8D85A3
- 8B849F
- 8A849B
- 888397
- 878394
- 858290
- 84828C
- 838188
- 818184
Renk uyumları
Tamamlayıcı +180°
- 8E85A7
Purple Hills
- 89906C
≈ Tiny Seedling
Analog -30° +30°
- 8E85A7
Purple Hills
- 7D8BAB
≈ Purple Impression
- 9C819C
≈ Mixed Berries
Üçlü +120° +240°
- 8E85A7
Purple Hills
- A4846D
≈ Iced Mocha
- 69968A
≈ Lunar Tide
Bölünmüş tamamlayıcı +150° +210°
- 8E85A7
Purple Hills
- 998A68
≈ Treasure Chamber
- 779479
≈ Mid Cypress
Dörtlü +90° +180° +270°
- 8E85A7
Purple Hills
- A8807A
≈ Fresh Cedar
- 89906C
≈ Tiny Seedling
- 66949B
≈ Clear Brook
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 3.46:1 · APCA Lc 62
Ag
AASiyah üzerinde
WCAG 6.06:1 · APCA Lc 40
En iyi metin rengi: #000000
WCAG 6.06:1 (AA) · APCA Lc 40
Contrast pairs
Kod parçacıkları
CSS
:root {
--purple-hills: #8e85a7;
--purple-hills-rgb: 142 133 167;
--purple-hills-oklch: oklch(0.637 0.051 297);
}
.element {
color: var(--purple-hills);
background-color: hsl(256 16% 59%);
border-color: oklch(0.637 0.051 297);
}Tailwind CSS v4
@theme {
--color-purple-hills: #8e85a7;
--color-purple-hills-50: #f7f2ff;
--color-purple-hills-100: #eae4f7;
--color-purple-hills-200: #d7d0e8;
--color-purple-hills-300: #bbb2cf;
--color-purple-hills-400: #a199ba;
--color-purple-hills-500: #897fa5;
--color-purple-hills-600: #746c8b;
--color-purple-hills-700: #5d566f;
--color-purple-hills-800: #433f53;
--color-purple-hills-900: #2f2b3a;
--color-purple-hills-950: #1b1924;
}SCSS
$purple-hills: #8e85a7;
$purple-hills-rgb: 142, 133, 167;
$purple-hills-light: mix(#fff, $purple-hills, 20%);
$purple-hills-dark: mix(#000, $purple-hills, 20%);
.element {
color: $purple-hills;
box-shadow: 0 0 0 2px rgba($purple-hills, 0.35);
}