Nazwany kolor · #AC3E5F
Heart’s Desire
Heart’s Desire to #AC3E5F: rgb(172 62 95), hsl(342 47% 46%), oklch(0.526 0.146 5.1). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Red mean? → · Heart’s Desire color name →
#AC3E5F
oklch(0.526 0.146 5.1)
Konwersje koloru
- HEX
- #ac3e5f
- RGB
- rgb(172 62 95)
- HSL
- hsl(342 47% 46%)
- HWB
- hwb(342 24% 33%)
- OKLCH
- oklch(0.526 0.146 5.1)
- OKLab
- oklab(0.526 0.146 0.013)
- CIE Lab
- lab(43.25 47.72 5.84)
- LCH
- lch(43.25 48.07 7)
- CMYK
- cmyk(0% 64% 45% 33%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- B6536E
- C0667D
- CA798C
- D38C9C
- DB9FAC
- E3B2BC
- EBC5CC
- F2D8DD
- F9EBEE
Odcienie ciemniejsze
- 953552
- 7F2B44
- 692338
- 541A2C
- 401220
- 2D0A15
- 1B040A
- 0B0103
- 010000
Tony
- A94762
- A64E65
- A25669
- 9E5D6C
- 9A636F
- 966973
- 916F76
- 8C7579
- 867B7D
Harmonie kolorów
Komplementarna +180°
- AC3E5F
Heart’s Desire
- 007C72
≈ Romantic Isle
Analogowa -30° +30°
- AC3E5F
Heart’s Desire
- 9C448B
≈ Viva Magenta
- AE4329
≈ Chocolate Chilli
Triada +120° +240°
- AC3E5F
Heart’s Desire
- 597700
≈ Topiary Green
- 0070B1
≈ Cobalt Glaze
Komplementarna rozszczepiona +150° +210°
- AC3E5F
Heart’s Desire
- 008048
≈ Picture Book Green
- 00788C
≈ Biscay Bay
Tetrada +90° +180° +270°
- AC3E5F
Heart’s Desire
- 7E6900
≈ Arousing Alligator
- 007C72
≈ Romantic Isle
- 545FBD
≈ Chinese Bellflower
Kontrast i dostępność
Ag
AANa bieli
WCAG 5.81:1 · APCA Lc 78
Ag
FailNa czerni
WCAG 3.60:1 · APCA Lc 23
Najlepszy kolor tekstu: #FFFFFF
WCAG 5.81:1 (AA) · APCA Lc 78
Contrast pairs
Fragmenty kodu
CSS
:root {
--heart-s-desire: #ac3e5f;
--heart-s-desire-rgb: 172 62 95;
--heart-s-desire-oklch: oklch(0.526 0.146 5.1);
}
.element {
color: var(--heart-s-desire);
background-color: hsl(342 47% 46%);
border-color: oklch(0.526 0.146 5.1);
}Tailwind CSS v4
@theme {
--color-heart-s-desire: #ac3e5f;
--color-heart-s-desire-50: #ffe5ee;
--color-heart-s-desire-100: #ffd4df;
--color-heart-s-desire-200: #ffbac9;
--color-heart-s-desire-300: #f797aa;
--color-heart-s-desire-400: #e57693;
--color-heart-s-desire-500: #d25579;
--color-heart-s-desire-600: #b14966;
--color-heart-s-desire-700: #8f3a52;
--color-heart-s-desire-800: #6a293d;
--color-heart-s-desire-900: #4a1c2a;
--color-heart-s-desire-950: #310b18;
}SCSS
$heart-s-desire: #ac3e5f;
$heart-s-desire-rgb: 172, 62, 95;
$heart-s-desire-light: mix(#fff, $heart-s-desire, 20%);
$heart-s-desire-dark: mix(#000, $heart-s-desire, 20%);
.element {
color: $heart-s-desire;
box-shadow: 0 0 0 2px rgba($heart-s-desire, 0.35);
}