Nazwany kolor · #7B6065
Pretty Puce
Pretty Puce to #7B6065: rgb(123 96 101), hsl(349 12% 43%), oklch(0.518 0.036 6). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Red mean? → · Pretty Puce color name →
#7B6065
oklch(0.518 0.036 6)
Konwersje koloru
- HEX
- #7b6065
- RGB
- rgb(123 96 101)
- HSL
- hsl(349 12% 43%)
- HWB
- hwb(349 38% 52%)
- OKLCH
- oklch(0.518 0.036 6)
- OKLab
- oklab(0.518 0.036 0.004)
- CIE Lab
- lab(43.63 11.92 1.56)
- LCH
- lch(43.63 12.02 7.4)
- CMYK
- cmyk(0% 22% 18% 52%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 886F73
- 947E82
- A18D90
- AE9C9F
- BBACAF
- C9BCBE
- D6CDCE
- E4DDDE
- F1EEEF
Odcienie ciemniejsze
- 6A5257
- 5A4549
- 4A383C
- 3A2C2F
- 2C2022
- 1E1517
- 100A0C
- 050303
- 010000
Tony
- 7C6368
- 7C666A
- 7D6A6D
- 7D6D70
- 7E7072
- 7E7375
- 7F7678
- 7F7A7B
- 807D7D
Harmonie kolorów
Komplementarna +180°
- 7B6065
Pretty Puce
- 516F6B
≈ Silver Pine
Analogowa -30° +30°
- 7B6065
Pretty Puce
- 766170
≈ Black Plum
- 7B615A
≈ Raisin in the Sun
Triada +120° +240°
- 7B6065
Pretty Puce
- 636C56
≈ Sea Fern
- 586B7C
≈ Scholarship
Komplementarna rozszczepiona +150° +210°
- 7B6065
Pretty Puce
- 586F60
≈ Palmerin
- 516E75
≈ Blue Sentinel
Tetrada +90° +180° +270°
- 7B6065
Pretty Puce
- 6E6951
≈ Spruce Woods
- 516F6B
≈ Silver Pine
- 62677D
≈ Violet Evening
Kontrast i dostępność
Ag
AANa bieli
WCAG 5.67:1 · APCA Lc 78
Ag
FailNa czerni
WCAG 3.70:1 · APCA Lc 23
Najlepszy kolor tekstu: #FFFFFF
WCAG 5.67:1 (AA) · APCA Lc 78
Contrast pairs
Fragmenty kodu
CSS
:root {
--pretty-puce: #7b6065;
--pretty-puce-rgb: 123 96 101;
--pretty-puce-oklch: oklch(0.518 0.036 6);
}
.element {
color: var(--pretty-puce);
background-color: hsl(349 12% 43%);
border-color: oklch(0.518 0.036 6);
}Tailwind CSS v4
@theme {
--color-pretty-puce: #7b6065;
--color-pretty-puce-50: #fff1f3;
--color-pretty-puce-100: #f3e3e5;
--color-pretty-puce-200: #e3ced1;
--color-pretty-puce-300: #c9b0b4;
--color-pretty-puce-400: #b2969b;
--color-pretty-puce-500: #9c7d82;
--color-pretty-puce-600: #846a6e;
--color-pretty-puce-700: #6a5458;
--color-pretty-puce-800: #4e3d41;
--color-pretty-puce-900: #362a2d;
--color-pretty-puce-950: #21181a;
}SCSS
$pretty-puce: #7b6065;
$pretty-puce-rgb: 123, 96, 101;
$pretty-puce-light: mix(#fff, $pretty-puce, 20%);
$pretty-puce-dark: mix(#000, $pretty-puce, 20%);
.element {
color: $pretty-puce;
box-shadow: 0 0 0 2px rgba($pretty-puce, 0.35);
}