Nazwany kolor · #FF0054
Blazing Dragonfruit
Blazing Dragonfruit to #FF0054: rgb(255 0 84), hsl(340 100% 50%), oklch(0.635 0.254 15.7). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Red mean? → · Blazing Dragonfruit color name →
#FF0054
oklch(0.635 0.254 15.7)
Konwersje koloru
- HEX
- #ff0054
- RGB
- rgb(255 0 84)
- HSL
- hsl(340 100% 50%)
- HWB
- hwb(340 0% 0%)
- OKLCH
- oklch(0.635 0.254 15.7)
- OKLab
- oklab(0.635 0.245 0.069)
- CIE Lab
- lab(54.85 82.07 31.35)
- LCH
- lch(54.85 87.85 20.9)
- CMYK
- cmyk(0% 100% 67% 0%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- FF4065
- FF5D75
- FF7686
- FF8C97
- FFA0A8
- FFB4B9
- FFC7CA
- FFDADC
- FFEDED
Odcienie ciemniejsze
- DE0048
- BE003C
- 9E0031
- 800026
- 63001B
- 480011
- 2E0008
- 160002
- 030000
Tony
- F42E59
- E9415E
- DD4F62
- D25967
- C6626B
- B96A70
- AC7074
- 9F7678
- 907B7C
Harmonie kolorów
Komplementarna +180°
- FF0054
Blazing Dragonfruit
- 009FA0
≈ Pleasant Stream
Analogowa -30° +30°
- FF0054
Blazing Dragonfruit
- EB22AB
≈ Magnificent Magenta
- DE5E00
≈ Ancient Bamboo
Triada +120° +240°
- FF0054
Blazing Dragonfruit
- 50A200
≈ Lawn Green
- 2088FF
≈ Pool Water
Komplementarna rozszczepiona +150° +210°
- FF0054
Blazing Dragonfruit
- 00A378
≈ Sport Green
- 0099C2
≈ Atomic Blue
Tetrada +90° +180° +270°
- FF0054
Blazing Dragonfruit
- 968F00
≈ Smoothie Green
- 009FA0
≈ Pleasant Stream
- 846FFF
≈ Blackthorn Berry
Kontrast i dostępność
Ag
FailNa bieli
WCAG 3.90:1 · APCA Lc 63
Ag
AANa czerni
WCAG 5.38:1 · APCA Lc 38
Najlepszy kolor tekstu: #000000
WCAG 5.38:1 (AA) · APCA Lc 38
Contrast pairs
Fragmenty kodu
CSS
:root {
--blazing-dragonfruit: #ff0054;
--blazing-dragonfruit-rgb: 255 0 84;
--blazing-dragonfruit-oklch: oklch(0.635 0.254 15.7);
}
.element {
color: var(--blazing-dragonfruit);
background-color: hsl(340 100% 50%);
border-color: oklch(0.635 0.254 15.7);
}Tailwind CSS v4
@theme {
--color-blazing-dragonfruit: #ff0054;
--color-blazing-dragonfruit-50: #ffd8da;
--color-blazing-dragonfruit-100: #ffc5c8;
--color-blazing-dragonfruit-200: #ffa4ab;
--color-blazing-dragonfruit-300: #ff7686;
--color-blazing-dragonfruit-400: #ff416a;
--color-blazing-dragonfruit-500: #ff0049;
--color-blazing-dragonfruit-600: #da003f;
--color-blazing-dragonfruit-700: #b00032;
--color-blazing-dragonfruit-800: #830027;
--color-blazing-dragonfruit-900: #5d001a;
--color-blazing-dragonfruit-950: #3f000b;
}SCSS
$blazing-dragonfruit: #ff0054;
$blazing-dragonfruit-rgb: 255, 0, 84;
$blazing-dragonfruit-light: mix(#fff, $blazing-dragonfruit, 20%);
$blazing-dragonfruit-dark: mix(#000, $blazing-dragonfruit, 20%);
.element {
color: $blazing-dragonfruit;
box-shadow: 0 0 0 2px rgba($blazing-dragonfruit, 0.35);
}