Nazwany kolor · #F04E45
Angry Flamingo
Angry Flamingo to #F04E45: rgb(240 78 69), hsl(3 85% 61%), oklch(0.649 0.2 27.3). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Red mean? → · Angry Flamingo color name →
#F04E45
oklch(0.649 0.2 27.3)
Konwersje koloru
- HEX
- #f04e45
- RGB
- rgb(240 78 69)
- HSL
- hsl(3 85% 61%)
- HWB
- hwb(3 27% 6%)
- OKLCH
- oklch(0.649 0.2 27.3)
- OKLab
- oklab(0.649 0.178 0.092)
- CIE Lab
- lab(57.28 62.5 41.94)
- LCH
- lch(57.28 75.26 33.9)
- CMYK
- cmyk(0% 68% 71% 6%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- F46458
- F8786B
- FB8A7E
- FE9B90
- FFADA2
- FFBDB4
- FFCEC7
- FFDED9
- FFEFEC
Odcienie ciemniejsze
- D1433B
- B23831
- 952D27
- 78231E
- 5D1915
- 430F0C
- 2A0705
- 140202
- 030000
Tony
- E6574D
- DC5E54
- D2655A
- C76A60
- BC6F66
- B1736B
- A67771
- 9A7A76
- 8D7D7B
Harmonie kolorów
Komplementarna +180°
- F04E45
Angry Flamingo
- 00A1B1
≈ Breaking Wave
Analogowa -30° +30°
- F04E45
Angry Flamingo
- E74B90
≈ Tutuji Pink
- D37100
≈ Marmalade
Triada +120° +240°
- F04E45
Angry Flamingo
- 00AC40
≈ Poison Ivy
- 5C85FF
≈ Skinny Jeans
Komplementarna rozszczepiona +150° +210°
- F04E45
Angry Flamingo
- 00A68E
≈ Ottawa Falls
- 0099DA
≈ Atmosphere
Tetrada +90° +180° +270°
- F04E45
Angry Flamingo
- 899A00
≈ BioShock
- 00A1B1
≈ Breaking Wave
- 9F6CF7
≈ Purple Hedonist
Kontrast i dostępność
Ag
FailNa bieli
WCAG 3.57:1 · APCA Lc 62
Ag
AANa czerni
WCAG 5.88:1 · APCA Lc 40
Najlepszy kolor tekstu: #000000
WCAG 5.88:1 (AA) · APCA Lc 40
Contrast pairs
Fragmenty kodu
CSS
:root {
--angry-flamingo: #f04e45;
--angry-flamingo-rgb: 240 78 69;
--angry-flamingo-oklch: oklch(0.649 0.2 27.3);
}
.element {
color: var(--angry-flamingo);
background-color: hsl(3 85% 61%);
border-color: oklch(0.649 0.2 27.3);
}Tailwind CSS v4
@theme {
--color-angry-flamingo: #f04e45;
--color-angry-flamingo-50: #ffe0d4;
--color-angry-flamingo-100: #ffcfc1;
--color-angry-flamingo-200: #ffb3a2;
--color-angry-flamingo-300: #ff8c7a;
--color-angry-flamingo-400: #ff6559;
--color-angry-flamingo-500: #ee3632;
--color-angry-flamingo-600: #c9302c;
--color-angry-flamingo-700: #a12723;
--color-angry-flamingo-800: #79191b;
--color-angry-flamingo-900: #551111;
--color-angry-flamingo-950: #390204;
}SCSS
$angry-flamingo: #f04e45;
$angry-flamingo-rgb: 240, 78, 69;
$angry-flamingo-light: mix(#fff, $angry-flamingo, 20%);
$angry-flamingo-dark: mix(#000, $angry-flamingo, 20%);
.element {
color: $angry-flamingo;
box-shadow: 0 0 0 2px rgba($angry-flamingo, 0.35);
}