Najbliższy nazwany kolor · #CF3D63
#CF3D63
Najbliższy nazwany kolor: Paper Hearts
#CF3D63 (rgb(207 61 99), hsl(344 60% 53%), oklch(0.583 0.183 9.5)) jest najbliższy nazwanemu kolorowi Paper Hearts. Zobacz odcienie, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
#CF3D63
oklch(0.583 0.183 9.5)
Konwersje koloru
- HEX
- #cf3d63
- RGB
- rgb(207 61 99)
- HSL
- hsl(344 60% 53%)
- HWB
- hwb(344 24% 19%)
- OKLCH
- oklch(0.583 0.183 9.5)
- OKLab
- oklab(0.583 0.18 0.03)
- CIE Lab
- lab(49.48 59.52 13.16)
- LCH
- lch(49.48 60.96 12.5)
- CMYK
- cmyk(0% 71% 52% 19%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- D75471
- DE6980
- E47D8F
- EA909F
- EFA3AE
- F3B5BE
- F7C8CE
- FBDADE
- FDECEE
Odcienie ciemniejsze
- B43455
- 992B47
- 7F223A
- 671A2E
- 4F1221
- 380A16
- 23040B
- 100103
- 020000
Tony
- C94866
- C25169
- BB586C
- B45F6F
- AC6672
- A46C74
- 9C7177
- 93777A
- 8A7B7D
Harmonie kolorów
Komplementarna +180°
- CF3D63
Paper Hearts
- 008E88
≈ Aqua Experience
Analogowa -30° +30°
- CF3D63
Paper Hearts
- BD459D
≈ Ultraviolet Nusp
- D04704
≈ Ōkaihau Express
Triada +120° +240°
- CF3D63
Paper Hearts
- 5C8C00
≈ Sap Green
- 007ED6
≈ Electron Blue
Komplementarna rozszczepiona +150° +210°
- CF3D63
Paper Hearts
- 00925E
≈ Emerald Lake
- 0089A6
≈ Capri Breeze
Tetrada +90° +180° +270°
- CF3D63
Paper Hearts
- 8D7C00
≈ Moscow Papyrus
- 008E88
≈ Aqua Experience
- 6968E3
≈ If I Could Fly
Kontrast i dostępność
Ag
AANa bieli
WCAG 4.66:1 · APCA Lc 71
Ag
AANa czerni
WCAG 4.50:1 · APCA Lc 30
Najlepszy kolor tekstu: #FFFFFF
WCAG 4.66:1 (AA) · APCA Lc 71
Contrast pairs
Fragmenty kodu
CSS
:root {
--paper-hearts: #cf3d63;
--paper-hearts-rgb: 207 61 99;
--paper-hearts-oklch: oklch(0.583 0.183 9.5);
}
.element {
color: var(--paper-hearts);
background-color: hsl(344 60% 53%);
border-color: oklch(0.583 0.183 9.5);
}Tailwind CSS v4
@theme {
--color-paper-hearts: #cf3d63;
--color-paper-hearts-50: #ffe0e8;
--color-paper-hearts-100: #ffcfd8;
--color-paper-hearts-200: #ffb3c0;
--color-paper-hearts-300: #ff8d9f;
--color-paper-hearts-400: #f56887;
--color-paper-hearts-500: #e33f6b;
--color-paper-hearts-600: #c0375b;
--color-paper-hearts-700: #9a2c48;
--color-paper-hearts-800: #731e37;
--color-paper-hearts-900: #511425;
--color-paper-hearts-950: #360514;
}SCSS
$paper-hearts: #cf3d63;
$paper-hearts-rgb: 207, 61, 99;
$paper-hearts-light: mix(#fff, $paper-hearts, 20%);
$paper-hearts-dark: mix(#000, $paper-hearts, 20%);
.element {
color: $paper-hearts;
box-shadow: 0 0 0 2px rgba($paper-hearts, 0.35);
}