Nazwany kolor · #F5D1C8
Pink Cloud
Pink Cloud to #F5D1C8: rgb(245 209 200), hsl(12 69% 87%), oklch(0.889 0.043 34.3). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Pink mean? → · Pink Cloud color name →
#F5D1C8
oklch(0.889 0.043 34.3)
Konwersje koloru
- HEX
- #f5d1c8
- RGB
- rgb(245 209 200)
- HSL
- hsl(12 69% 87%)
- HWB
- hwb(12 78% 4%)
- OKLCH
- oklch(0.889 0.043 34.3)
- OKLab
- oklab(0.889 0.035 0.024)
- CIE Lab
- lab(86.76 11.99 9.41)
- LCH
- lch(86.76 15.24 38.1)
- CMYK
- cmyk(0% 15% 18% 4%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- F6D6CD
- F7DAD3
- F8DFD8
- F9E3DE
- FAE8E3
- FBEDE9
- FCF1EE
- FDF6F4
- FEFAF9
Odcienie ciemniejsze
- D5B5AE
- B69B94
- 98817B
- 7B6863
- 5F504C
- 443936
- 2B2321
- 15100F
- 030202
Tony
- E9C9C1
- DDC0B9
- D1B8B2
- C5B0AB
- B9A8A3
- ADA09C
- A29895
- 96908E
- 8B8887
Harmonie kolorów
Komplementarna +180°
- F5D1C8
Pink Cloud
- BBE2EC
≈ Diminished Blue
Analogowa -30° +30°
- F5D1C8
Pink Cloud
- F4CFD7
≈ Lover’s Retreat
- EFD5BE
≈ Iced Apricot
Triada +120° +240°
- F5D1C8
Pink Cloud
- C5E3CE
≈ Wishful Green
- D1D9F7
≈ Flax Bloom
Komplementarna rozszczepiona +150° +210°
- F5D1C8
Pink Cloud
- BCE4DD
≈ Bleached Aqua
- C4DEF5
≈ Island View
Tetrada +90° +180° +270°
- F5D1C8
Pink Cloud
- D4E0C1
≈ Security
- BBE2EC
≈ Diminished Blue
- E0D4F2
≈ Japan Blush
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.41:1 · APCA Lc 20
Ag
AAANa czerni
WCAG 14.83:1 · APCA Lc 83
Najlepszy kolor tekstu: #000000
WCAG 14.83:1 (AAA) · APCA Lc 83
Contrast pairs
Fragmenty kodu
CSS
:root {
--pink-cloud: #f5d1c8;
--pink-cloud-rgb: 245 209 200;
--pink-cloud-oklch: oklch(0.889 0.043 34.3);
}
.element {
color: var(--pink-cloud);
background-color: hsl(12 69% 87%);
border-color: oklch(0.889 0.043 34.3);
}Tailwind CSS v4
@theme {
--color-pink-cloud: #f5d1c8;
--color-pink-cloud-50: #fff1ed;
--color-pink-cloud-100: #f6e3de;
--color-pink-cloud-200: #e6cec8;
--color-pink-cloud-300: #ccb0a9;
--color-pink-cloud-400: #b6968e;
--color-pink-cloud-500: #a07c74;
--color-pink-cloud-600: #876962;
--color-pink-cloud-700: #6d544e;
--color-pink-cloud-800: #503d39;
--color-pink-cloud-900: #382a27;
--color-pink-cloud-950: #221815;
}SCSS
$pink-cloud: #f5d1c8;
$pink-cloud-rgb: 245, 209, 200;
$pink-cloud-light: mix(#fff, $pink-cloud, 20%);
$pink-cloud-dark: mix(#000, $pink-cloud, 20%);
.element {
color: $pink-cloud;
box-shadow: 0 0 0 2px rgba($pink-cloud, 0.35);
}