Najbliższy nazwany kolor · #CC5071
#CC5071
Najbliższy nazwany kolor: Strawberry Moon
#CC5071 (rgb(204 80 113), hsl(344 55% 56%), oklch(0.603 0.159 6.8)) jest najbliższy nazwanemu kolorowi Strawberry Moon. Zobacz odcienie, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
#CC5071
oklch(0.603 0.159 6.8)
Konwersje koloru
- HEX
- #cc5071
- RGB
- rgb(204 80 113)
- HSL
- hsl(344 55% 56%)
- HWB
- hwb(344 31% 20%)
- OKLCH
- oklch(0.603 0.159 6.8)
- OKLab
- oklab(0.603 0.158 0.019)
- CIE Lab
- lab(52.05 52.07 8.17)
- LCH
- lch(52.05 52.71 8.9)
- CMYK
- cmyk(0% 61% 45% 20%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- D3637E
- DA758C
- E08799
- E698A7
- ECA9B5
- F1BAC4
- F5CBD2
- F9DDE1
- FCEEF0
Odcienie ciemniejsze
- B14461
- 973952
- 7E2E43
- 652435
- 4E1A27
- 37101A
- 22070E
- 0F0204
- 020001
Tony
- C65773
- BF5D74
- B86276
- B16877
- AA6C79
- A2717A
- 9A757C
- 92797D
- 897D7F
Harmonie kolorów
Komplementarna +180°
- CC5071
Strawberry Moon
- 00958B
≈ Lights at Sea
Analogowa -30° +30°
- CC5071
Strawberry Moon
- BA56A4
≈ Magenta Memoir
- CE5734
≈ Bronze Satin
Triada +120° +240°
- CC5071
Strawberry Moon
- 689100
≈ Canopy
- 0086D9
≈ Blue Cola
Komplementarna rozszczepiona +150° +210°
- CC5071
Strawberry Moon
- 009A5C
≈ Militant Vegan
- 0090AB
≈ Zeftron
Tetrada +90° +180° +270°
- CC5071
Strawberry Moon
- 978000
≈ Thicket Green
- 00958B
≈ Lights at Sea
- 6B74DE
≈ C64 Purple
Kontrast i dostępność
Ag
FailNa bieli
WCAG 4.23:1 · APCA Lc 69
Ag
AANa czerni
WCAG 4.95:1 · APCA Lc 33
Najlepszy kolor tekstu: #000000
WCAG 4.95:1 (AA) · APCA Lc 33
Contrast pairs
Fragmenty kodu
CSS
:root {
--strawberry-moon: #cc5071;
--strawberry-moon-rgb: 204 80 113;
--strawberry-moon-oklch: oklch(0.603 0.159 6.8);
}
.element {
color: var(--strawberry-moon);
background-color: hsl(344 55% 56%);
border-color: oklch(0.603 0.159 6.8);
}Tailwind CSS v4
@theme {
--color-strawberry-moon: #cc5071;
--color-strawberry-moon-50: #ffe3ec;
--color-strawberry-moon-100: #ffd2dd;
--color-strawberry-moon-200: #ffb8c6;
--color-strawberry-moon-300: #fc94a7;
--color-strawberry-moon-400: #eb728f;
--color-strawberry-moon-500: #d84e74;
--color-strawberry-moon-600: #b74363;
--color-strawberry-moon-700: #93354f;
--color-strawberry-moon-800: #6d253b;
--color-strawberry-moon-900: #4d1929;
--color-strawberry-moon-950: #320916;
}SCSS
$strawberry-moon: #cc5071;
$strawberry-moon-rgb: 204, 80, 113;
$strawberry-moon-light: mix(#fff, $strawberry-moon, 20%);
$strawberry-moon-dark: mix(#000, $strawberry-moon, 20%);
.element {
color: $strawberry-moon;
box-shadow: 0 0 0 2px rgba($strawberry-moon, 0.35);
}