Nazwany kolor · #F3C1AB
Cosmetic Peach
Cosmetic Peach to #F3C1AB: rgb(243 193 171), hsl(18 75% 81%), oklch(0.85 0.065 45). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Pink mean? → · Cosmetic Peach color name →
#F3C1AB
oklch(0.85 0.065 45)
Konwersje koloru
- HEX
- #f3c1ab
- RGB
- rgb(243 193 171)
- HSL
- hsl(18 75% 81%)
- HWB
- hwb(18 67% 5%)
- OKLCH
- oklch(0.85 0.065 45)
- OKLab
- oklab(0.85 0.046 0.046)
- CIE Lab
- lab(82.18 16.2 18.29)
- LCH
- lch(82.18 24.43 48.5)
- CMYK
- cmyk(0% 21% 30% 5%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- F5C7B3
- F6CDBC
- F7D4C4
- F9DACC
- FAE0D5
- FBE6DD
- FCECE6
- FDF3EE
- FEF9F6
Odcienie ciemniejsze
- D3A794
- B48F7E
- 977768
- 7A5F54
- 5E4940
- 44342D
- 2B201B
- 140E0B
- 030201
Tony
- E7BAA7
- DBB4A2
- D0AD9E
- C4A79A
- B8A096
- AD9A91
- A2938D
- 968D89
- 8B8684
Harmonie kolorów
Komplementarna +180°
- F3C1AB
Cosmetic Peach
- A0D7EE
≈ Soft Summer Rain
Analogowa -30° +30°
- F3C1AB
Cosmetic Peach
- F5BDC0
≈ Candy Cane
- E7C89F
≈ Jasper Cane
Triada +120° +240°
- F3C1AB
Cosmetic Peach
- A6DCC3
≈ Shanghai Jade
- C8C8F7
≈ Soap
Komplementarna rozszczepiona +150° +210°
- F3C1AB
Cosmetic Peach
- 9BDCDB
≈ Pale Pastel
- B2D0F8
≈ Ice Cold Stare
Tetrada +90° +180° +270°
- F3C1AB
Cosmetic Peach
- BCD8AD
≈ Bleached Spruce
- A0D7EE
≈ Soft Summer Rain
- DEC1EB
≈ Beefy Pink
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.61:1 · APCA Lc 27
Ag
AAANa czerni
WCAG 13.02:1 · APCA Lc 76
Najlepszy kolor tekstu: #000000
WCAG 13.02:1 (AAA) · APCA Lc 76
Contrast pairs
Fragmenty kodu
CSS
:root {
--cosmetic-peach: #f3c1ab;
--cosmetic-peach-rgb: 243 193 171;
--cosmetic-peach-oklch: oklch(0.85 0.065 45);
}
.element {
color: var(--cosmetic-peach);
background-color: hsl(18 75% 81%);
border-color: oklch(0.85 0.065 45);
}Tailwind CSS v4
@theme {
--color-cosmetic-peach: #f3c1ab;
--color-cosmetic-peach-50: #fff0e6;
--color-cosmetic-peach-100: #fbe2d6;
--color-cosmetic-peach-200: #edccbd;
--color-cosmetic-peach-300: #d4ae9b;
--color-cosmetic-peach-400: #c0937f;
--color-cosmetic-peach-500: #ab7962;
--color-cosmetic-peach-600: #906653;
--color-cosmetic-peach-700: #745242;
--color-cosmetic-peach-800: #563b30;
--color-cosmetic-peach-900: #3c2921;
--color-cosmetic-peach-950: #261610;
}SCSS
$cosmetic-peach: #f3c1ab;
$cosmetic-peach-rgb: 243, 193, 171;
$cosmetic-peach-light: mix(#fff, $cosmetic-peach, 20%);
$cosmetic-peach-dark: mix(#000, $cosmetic-peach, 20%);
.element {
color: $cosmetic-peach;
box-shadow: 0 0 0 2px rgba($cosmetic-peach, 0.35);
}