Adlandırılmış renk · #FF8449
Tangerine Dream
Tangerine Dream, #FF8449: rgb(255 132 73), hsl(19 100% 64%), oklch(0.742 0.166 44.6). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Red mean? → · Tangerine Dream color name →
#FF8449
oklch(0.742 0.166 44.6)
Renk dönüşümleri
- HEX
- #ff8449
- RGB
- rgb(255 132 73)
- HSL
- hsl(19 100% 64%)
- HWB
- hwb(19 29% 0%)
- OKLCH
- oklch(0.742 0.166 44.6)
- OKLab
- oklab(0.742 0.118 0.117)
- CIE Lab
- lab(68.89 44.8 53.01)
- LCH
- lch(68.89 69.41 49.8)
- CMYK
- cmyk(0% 48% 71% 0%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- FF915E
- FF9E72
- FFAB84
- FFB896
- FFC4A8
- FFD0B9
- FFDCCB
- FFE8DC
- FFF3EE
Koyu tonlar
- DE723E
- BE6034
- 9E4F2A
- 803F20
- 632F17
- 48200E
- 2E1206
- 160602
- 030100
Gri tonlar
- F38552
- E68559
- DA855F
- CD8565
- C1856B
- B48570
- A88474
- 9B8378
- 8E817C
Renk uyumları
Tamamlayıcı +180°
- FF8449
Tangerine Dream
- 00BDED
≈ Blue Bikini
Analog -30° +30°
- FF8449
Tangerine Dream
- FF7C8B
≈ Magical Girl
- E49A00
≈ Gamboge
Üçlü +120° +240°
- FF8449
Tangerine Dream
- 00CA92
≈ Caribbean Green
- A29EFF
≈ Cobalite
Bölünmüş tamamlayıcı +150° +210°
- FF8449
Tangerine Dream
- 00C4C3
≈ Cala Benirrás Blue
- 6DAEFF
≈ Fennel Flower
Dörtlü +90° +180° +270°
- FF8449
Tangerine Dream
- 7CC24C
≈ Conceptual
- 00BDED
≈ Blue Bikini
- D288F3
≈ Azuremyst Isle
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 2.42:1 · APCA Lc 47
Ag
AAASiyah üzerinde
WCAG 8.64:1 · APCA Lc 55
En iyi metin rengi: #000000
WCAG 8.64:1 (AAA) · APCA Lc 55
Contrast pairs
Kod parçacıkları
CSS
:root {
--tangerine-dream: #ff8449;
--tangerine-dream-rgb: 255 132 73;
--tangerine-dream-oklch: oklch(0.742 0.166 44.6);
}
.element {
color: var(--tangerine-dream);
background-color: hsl(19 100% 64%);
border-color: oklch(0.742 0.166 44.6);
}Tailwind CSS v4
@theme {
--color-tangerine-dream: #ff8449;
--color-tangerine-dream-50: #ffe7cd;
--color-tangerine-dream-100: #ffd8b9;
--color-tangerine-dream-200: #ffbe97;
--color-tangerine-dream-300: #fd9b6b;
--color-tangerine-dream-400: #ed7942;
--color-tangerine-dream-500: #db5700;
--color-tangerine-dream-600: #b94a00;
--color-tangerine-dream-700: #953b04;
--color-tangerine-dream-800: #6f2906;
--color-tangerine-dream-900: #4e1c04;
--color-tangerine-dream-950: #340b00;
}SCSS
$tangerine-dream: #ff8449;
$tangerine-dream-rgb: 255, 132, 73;
$tangerine-dream-light: mix(#fff, $tangerine-dream, 20%);
$tangerine-dream-dark: mix(#000, $tangerine-dream, 20%);
.element {
color: $tangerine-dream;
box-shadow: 0 0 0 2px rgba($tangerine-dream, 0.35);
}