Nazwany kolor · #FF3355
Detailed Devil
Detailed Devil to #FF3355: rgb(255 51 85), hsl(350 100% 60%), oklch(0.653 0.235 18.6). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Red mean? → · Detailed Devil color name →
#FF3355
oklch(0.653 0.235 18.6)
Konwersje koloru
- HEX
- #ff3355
- RGB
- rgb(255 51 85)
- HSL
- hsl(350 100% 60%)
- HWB
- hwb(350 20% 0%)
- OKLCH
- oklch(0.653 0.235 18.6)
- OKLab
- oklab(0.653 0.222 0.075)
- CIE Lab
- lab(57.24 75.48 33.64)
- LCH
- lch(57.24 82.64 24)
- CMYK
- cmyk(0% 80% 67% 0%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- FF5266
- FF6B76
- FF8087
- FF9498
- FFA7A9
- FFB9BA
- FFCBCB
- FFDCDC
- FFEEED
Odcienie ciemniejsze
- DE2B49
- BE233D
- 9E1C31
- 801426
- 630D1C
- 480711
- 2E0308
- 160102
- 030000
Tony
- F4445A
- E8505F
- DD5A64
- D16268
- C5696C
- B86F70
- AB7474
- 9E7878
- 8F7C7C
Harmonie kolorów
Komplementarna +180°
- FF3355
Detailed Devil
- 00A4A9
≈ Wax Crayon Blue
Analogowa -30° +30°
- FF3355
Detailed Devil
- EE3AA7
≈ Pink Bite
- E26700
≈ Brihaspati Orange
Triada +120° +240°
- FF3355
Detailed Devil
- 41AB00
≈ Early Dew
- 418DFF
≈ Bleuchâtel Blue
Komplementarna rozszczepiona +150° +210°
- FF3355
Detailed Devil
- 00A981
≈ Simply Green
- 009ECE
≈ Structural Blue
Tetrada +90° +180° +270°
- FF3355
Detailed Devil
- 989600
≈ Turtle Moss
- 00A4A9
≈ Wax Crayon Blue
- 8F74FF
≈ Blackthorn Berry
Kontrast i dostępność
Ag
FailNa bieli
WCAG 3.58:1 · APCA Lc 62
Ag
AANa czerni
WCAG 5.85:1 · APCA Lc 40
Najlepszy kolor tekstu: #000000
WCAG 5.85:1 (AA) · APCA Lc 40
Contrast pairs
Fragmenty kodu
CSS
:root {
--detailed-devil: #ff3355;
--detailed-devil-rgb: 255 51 85;
--detailed-devil-oklch: oklch(0.653 0.235 18.6);
}
.element {
color: var(--detailed-devil);
background-color: hsl(350 100% 60%);
border-color: oklch(0.653 0.235 18.6);
}Tailwind CSS v4
@theme {
--color-detailed-devil: #ff3355;
--color-detailed-devil-50: #ffdbd9;
--color-detailed-devil-100: #ffc8c7;
--color-detailed-devil-200: #ffa9a9;
--color-detailed-devil-300: #ff7e83;
--color-detailed-devil-400: #ff4f66;
--color-detailed-devil-500: #fb0044;
--color-detailed-devil-600: #d4003b;
--color-detailed-devil-700: #ab022e;
--color-detailed-devil-800: #800024;
--color-detailed-devil-900: #5b0218;
--color-detailed-devil-950: #3d0009;
}SCSS
$detailed-devil: #ff3355;
$detailed-devil-rgb: 255, 51, 85;
$detailed-devil-light: mix(#fff, $detailed-devil, 20%);
$detailed-devil-dark: mix(#000, $detailed-devil, 20%);
.element {
color: $detailed-devil;
box-shadow: 0 0 0 2px rgba($detailed-devil, 0.35);
}