Nazwany kolor · #D4A9C3
Heart to Heart
Heart to Heart to #D4A9C3: rgb(212 169 195), hsl(324 33% 75%), oklch(0.781 0.061 341.7). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Pink mean? → · Heart to Heart color name →
#D4A9C3
oklch(0.781 0.061 341.7)
Konwersje koloru
- HEX
- #d4a9c3
- RGB
- rgb(212 169 195)
- HSL
- hsl(324 33% 75%)
- HWB
- hwb(324 66% 17%)
- OKLCH
- oklch(0.781 0.061 341.7)
- OKLab
- oklab(0.781 0.058 -0.019)
- CIE Lab
- lab(73.8 19.36 -7.03)
- LCH
- lch(73.8 20.6 340)
- CMYK
- cmyk(0% 20% 8% 17%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- D8B1C9
- DDBACF
- E1C2D5
- E6CBDB
- EAD3E1
- EEDCE7
- F3E5ED
- F7EDF3
- FBF6F9
Odcienie ciemniejsze
- B892A9
- 9D7C90
- 836778
- 695360
- 513F4A
- 3A2C34
- 241B20
- 100A0E
- 020102
Tony
- CBA5BC
- C3A1B5
- BA9DAE
- B299A8
- AA94A1
- A1909A
- 998C94
- 91888D
- 888486
Harmonie kolorów
Komplementarna +180°
- D4A9C3
Heart to Heart
- 95C4AC
≈ Bella Green
Analogowa -30° +30°
- D4A9C3
Heart to Heart
- C5ADD5
≈ Purple Gala
- DCA8AE
≈ Prom
Triada +120° +240°
- D4A9C3
Heart to Heart
- BFBA8D
≈ Goody Two Shoes
- 8DC1D4
≈ Boutonniere
Komplementarna rozszczepiona +150° +210°
- D4A9C3
Heart to Heart
- AAC098
≈ Seawashed Glass
- 8AC5C1
≈ Enchanted Isle
Tetrada +90° +180° +270°
- D4A9C3
Heart to Heart
- D1B28D
≈ Ligonier Tan
- 95C4AC
≈ Bella Green
- 9CBBDE
≈ Rainy Week
Kontrast i dostępność
Ag
FailNa bieli
WCAG 2.04:1 · APCA Lc 40
Ag
AAANa czerni
WCAG 10.26:1 · APCA Lc 62
Najlepszy kolor tekstu: #000000
WCAG 10.26:1 (AAA) · APCA Lc 62
Contrast pairs
Fragmenty kodu
CSS
:root {
--heart-to-heart: #d4a9c3;
--heart-to-heart-rgb: 212 169 195;
--heart-to-heart-oklch: oklch(0.781 0.061 341.7);
}
.element {
color: var(--heart-to-heart);
background-color: hsl(324 33% 75%);
border-color: oklch(0.781 0.061 341.7);
}Tailwind CSS v4
@theme {
--color-heart-to-heart: #d4a9c3;
--color-heart-to-heart-50: #ffeff9;
--color-heart-to-heart-100: #f8e0ed;
--color-heart-to-heart-200: #e8cadb;
--color-heart-to-heart-300: #cfacbf;
--color-heart-to-heart-400: #b891a9;
--color-heart-to-heart-500: #a37692;
--color-heart-to-heart-600: #8a647b;
--color-heart-to-heart-700: #6e5063;
--color-heart-to-heart-800: #513a49;
--color-heart-to-heart-900: #382833;
--color-heart-to-heart-950: #23161e;
}SCSS
$heart-to-heart: #d4a9c3;
$heart-to-heart-rgb: 212, 169, 195;
$heart-to-heart-light: mix(#fff, $heart-to-heart, 20%);
$heart-to-heart-dark: mix(#000, $heart-to-heart, 20%);
.element {
color: $heart-to-heart;
box-shadow: 0 0 0 2px rgba($heart-to-heart, 0.35);
}