Nazwany kolor · #CF524E
Ginger Flower
Ginger Flower to #CF524E: rgb(207 82 78), hsl(2 57% 56%), oklch(0.602 0.16 24.9). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Red mean? → · Ginger Flower color name →
#CF524E
oklch(0.602 0.16 24.9)
Konwersje koloru
- HEX
- #cf524e
- RGB
- rgb(207 82 78)
- HSL
- hsl(2 57% 56%)
- HWB
- hwb(2 31% 19%)
- OKLCH
- oklch(0.602 0.16 24.9)
- OKLab
- oklab(0.602 0.145 0.067)
- CIE Lab
- lab(52.28 50.22 29.31)
- LCH
- lch(52.28 58.15 30.3)
- CMYK
- cmyk(0% 60% 62% 19%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- D6655F
- DD7770
- E38881
- E89A93
- EDAAA4
- F2BBB6
- F6CCC8
- FADDDA
- FDEEEC
Odcienie ciemniejsze
- B44643
- 993B38
- 7F2F2D
- 672523
- 4F1A19
- 38110F
- 230807
- 100202
- 020000
Tony
- C85954
- C15F59
- BA645E
- B36963
- AB6E68
- A3726D
- 9B7672
- 937977
- 8A7D7B
Harmonie kolorów
Komplementarna +180°
- CF524E
Ginger Flower
- 00929E
≈ Jaded
Analogowa -30° +30°
- CF524E
Ginger Flower
- C75186
≈ Sparkling Blueberry Lemonade
- C26300
≈ Crema
Triada +120° +240°
- CF524E
Ginger Flower
- 33983D
≈ Boogie Blast
- 517BDF
≈ Skies of Cyberspace
Komplementarna rozszczepiona +150° +210°
- CF524E
Ginger Flower
- 00967D
≈ Pool Table
- 008BC2
≈ Celebration Blue
Tetrada +90° +180° +270°
- CF524E
Ginger Flower
- 7F8900
≈ Krypton Green
- 00929E
≈ Jaded
- 8969D5
≈ Matt Purple
Kontrast i dostępność
Ag
FailNa bieli
WCAG 4.22:1 · APCA Lc 68
Ag
AANa czerni
WCAG 4.97:1 · APCA Lc 33
Najlepszy kolor tekstu: #000000
WCAG 4.97:1 (AA) · APCA Lc 33
Contrast pairs
Fragmenty kodu
CSS
:root {
--ginger-flower: #cf524e;
--ginger-flower-rgb: 207 82 78;
--ginger-flower-oklch: oklch(0.602 0.16 24.9);
}
.element {
color: var(--ginger-flower);
background-color: hsl(2 57% 56%);
border-color: oklch(0.602 0.16 24.9);
}Tailwind CSS v4
@theme {
--color-ginger-flower: #cf524e;
--color-ginger-flower-50: #ffe5dd;
--color-ginger-flower-100: #ffd4cb;
--color-ginger-flower-200: #ffbab0;
--color-ginger-flower-300: #ff968b;
--color-ginger-flower-400: #ee746d;
--color-ginger-flower-500: #dc504d;
--color-ginger-flower-600: #ba4542;
--color-ginger-flower-700: #953734;
--color-ginger-flower-800: #6f2627;
--color-ginger-flower-900: #4f1a1a;
--color-ginger-flower-950: #34090b;
}SCSS
$ginger-flower: #cf524e;
$ginger-flower-rgb: 207, 82, 78;
$ginger-flower-light: mix(#fff, $ginger-flower, 20%);
$ginger-flower-dark: mix(#000, $ginger-flower, 20%);
.element {
color: $ginger-flower;
box-shadow: 0 0 0 2px rgba($ginger-flower, 0.35);
}