Najbliższy nazwany kolor · #CC425F
#CC425F
Najbliższy nazwany kolor: Paper Hearts
#CC425F (rgb(204 66 95), hsl(347 58% 53%), oklch(0.582 0.174 12)) jest najbliższy nazwanemu kolorowi Paper Hearts. Zobacz odcienie, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
#CC425F
oklch(0.582 0.174 12)
Konwersje koloru
- HEX
- #cc425f
- RGB
- rgb(204 66 95)
- HSL
- hsl(347 58% 53%)
- HWB
- hwb(347 26% 20%)
- OKLCH
- oklch(0.582 0.174 12)
- OKLab
- oklab(0.582 0.17 0.036)
- CIE Lab
- lab(49.54 56.56 15.56)
- LCH
- lch(49.54 58.66 15.4)
- CMYK
- cmyk(0% 68% 53% 20%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- D4586E
- DB6C7D
- E17F8C
- E7929C
- EDA4AC
- F2B6BC
- F6C8CD
- FADADD
- FDEDEE
Odcienie ciemniejsze
- B13852
- 972F44
- 7E2538
- 651C2C
- 4E1420
- 370B15
- 22050A
- 0F0103
- 020000
Tony
- C64B62
- BF5366
- B95B69
- B2616C
- AB6770
- A36D73
- 9B7276
- 93777A
- 8A7C7D
Harmonie kolorów
Komplementarna +180°
- CC425F
Paper Hearts
- 008D8A
≈ Corfu Shallows
Analogowa -30° +30°
- CC425F
Paper Hearts
- BC4797
≈ Boat Orchid
- CB4D04
≈ Dark Orange
Triada +120° +240°
- CC425F
Paper Hearts
- 558D00
≈ Pistachio Flour
- 007CDD
≈ Soothing Sapphire
Komplementarna rozszczepiona +150° +210°
- CC425F
Paper Hearts
- 009263
≈ Emerald Lake
- 0088A8
≈ Hacienda Blue
Tetrada +90° +180° +270°
- CC425F
Paper Hearts
- 8A7D00
≈ Moscow Papyrus
- 008D8A
≈ Corfu Shallows
- 6E68DD
≈ Exodus Fruit
Kontrast i dostępność
Ag
AANa bieli
WCAG 4.65:1 · APCA Lc 71
Ag
AANa czerni
WCAG 4.51:1 · APCA Lc 30
Najlepszy kolor tekstu: #FFFFFF
WCAG 4.65:1 (AA) · APCA Lc 71
Contrast pairs
Fragmenty kodu
CSS
:root {
--paper-hearts: #cc425f;
--paper-hearts-rgb: 204 66 95;
--paper-hearts-oklch: oklch(0.582 0.174 12);
}
.element {
color: var(--paper-hearts);
background-color: hsl(347 58% 53%);
border-color: oklch(0.582 0.174 12);
}Tailwind CSS v4
@theme {
--color-paper-hearts: #cc425f;
--color-paper-hearts-50: #ffe2e6;
--color-paper-hearts-100: #ffd1d6;
--color-paper-hearts-200: #ffb5be;
--color-paper-hearts-300: #ff909c;
--color-paper-hearts-400: #f26c83;
--color-paper-hearts-500: #e04567;
--color-paper-hearts-600: #bd3c57;
--color-paper-hearts-700: #983046;
--color-paper-hearts-800: #712134;
--color-paper-hearts-900: #501624;
--color-paper-hearts-950: #350613;
}SCSS
$paper-hearts: #cc425f;
$paper-hearts-rgb: 204, 66, 95;
$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);
}