لون مسمّى · #FF5522
Smashing Pumpkins
Smashing Pumpkins هو #FF5522: rgb(255 85 34)، hsl(14 100% 57%)، oklch(0.677 0.214 36). شاهد الدرجات الفاتحة والداكنة والتناسقات وتباين WCAG وAPCA وأكواد CSS وTailwind v4 وSCSS.
What does Red mean? → · Smashing Pumpkins color name →
#FF5522
oklch(0.677 0.214 36)
تحويلات الألوان
- HEX
- #ff5522
- RGB
- rgb(255 85 34)
- HSL
- hsl(14 100% 57%)
- HWB
- hwb(14 13% 0%)
- OKLCH
- oklch(0.677 0.214 36)
- OKLab
- oklab(0.677 0.173 0.126)
- CIE Lab
- lab(60.66 64 62.97)
- LCH
- lch(60.66 89.79 44.5)
- CMYK
- cmyk(0% 67% 87% 0%)
درجات فاتحة · درجات داكنة · درجات رمادية
درجات فاتحة
- FF6B41
- FF7E5A
- FF9070
- FFA185
- FFB199
- FFC1AE
- FFD1C2
- FFE0D6
- FFF0EB
درجات داكنة
- DE491C
- BE3D16
- 9E3111
- 80260B
- 631C07
- 481103
- 2E0801
- 160200
- 030000
درجات رمادية
- F35D34
- E86440
- DC6A4B
- D06F55
- C3735D
- B77765
- AA7A6C
- 9D7C73
- 8F7E7A
تناسق الألوان
متمم +180°
- FF5522
Smashing Pumpkins
- 00A9C6
≈ Gummy Dolphins
متجاور -30° +30°
- FF5522
Smashing Pumpkins
- FC4B83
≈ Sasquatch Socks
- D48100
≈ Copious Caramel
ثلاثي +120° +240°
- FF5522
Smashing Pumpkins
- 00B46B
≈ Green Mana
- 7D8AFF
≈ Lavender Blue Shadow
متمم منقسم +150° +210°
- FF5522
Smashing Pumpkins
- 00AEA2
≈ Cozumel
- 009EFB
≈ Fresh Blue of Bel Air
رباعي +90° +180° +270°
- FF5522
Smashing Pumpkins
- 7DA900
≈ Green Envy
- 00A9C6
≈ Gummy Dolphins
- B96AFD
≈ Queer Purple
التباين وإمكانية الوصول
Ag
Failعلى الأبيض
WCAG 3.19:1 · APCA Lc 58
Ag
AAعلى الأسود
WCAG 6.57:1 · APCA Lc 44
أفضل لون للنص: #000000
WCAG 6.57:1 (AA) · APCA Lc 44
Contrast pairs
مقتطفات الأكواد
CSS
:root {
--smashing-pumpkins: #ff5522;
--smashing-pumpkins-rgb: 255 85 34;
--smashing-pumpkins-oklch: oklch(0.677 0.214 36);
}
.element {
color: var(--smashing-pumpkins);
background-color: hsl(14 100% 57%);
border-color: oklch(0.677 0.214 36);
}Tailwind CSS v4
@theme {
--color-smashing-pumpkins: #ff5522;
--color-smashing-pumpkins-50: #ffe1c9;
--color-smashing-pumpkins-100: #ffcfb4;
--color-smashing-pumpkins-200: #ffb390;
--color-smashing-pumpkins-300: #ff8b61;
--color-smashing-pumpkins-400: #ff6336;
--color-smashing-pumpkins-500: #f22f00;
--color-smashing-pumpkins-600: #cd2b00;
--color-smashing-pumpkins-700: #a52300;
--color-smashing-pumpkins-800: #7c1600;
--color-smashing-pumpkins-900: #570f00;
--color-smashing-pumpkins-950: #3b0000;
}SCSS
$smashing-pumpkins: #ff5522;
$smashing-pumpkins-rgb: 255, 85, 34;
$smashing-pumpkins-light: mix(#fff, $smashing-pumpkins, 20%);
$smashing-pumpkins-dark: mix(#000, $smashing-pumpkins, 20%);
.element {
color: $smashing-pumpkins;
box-shadow: 0 0 0 2px rgba($smashing-pumpkins, 0.35);
}