Adlandırılmış renk · #BB603C
Deep Reddish Orange
Deep Reddish Orange, #BB603C: rgb(187 96 60), hsl(17 51% 48%), oklch(0.59 0.128 41.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? → · Deep Reddish Orange color name →
#BB603C
oklch(0.59 0.128 41.6)
Renk dönüşümleri
- HEX
- #bb603c
- RGB
- rgb(187 96 60)
- HSL
- hsl(17 51% 48%)
- HWB
- hwb(17 24% 27%)
- OKLCH
- oklch(0.59 0.128 41.6)
- OKLab
- oklab(0.59 0.095 0.085)
- CIE Lab
- lab(51.51 35.37 37.56)
- LCH
- lch(51.51 51.6 46.7)
- CMYK
- cmyk(0% 49% 68% 27%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- C37050
- CB8063
- D39076
- DAA08A
- E1AF9D
- E7BFB0
- EECFC3
- F4DFD7
- FAEFEB
Koyu tonlar
- A25233
- 8A452A
- 733821
- 5C2C19
- 462011
- 32150A
- 1F0A04
- 0D0301
- 020000
Gri tonlar
- B66444
- B1684C
- AB6C53
- A66F5A
- A07261
- 9A7567
- 94786E
- 8E7B74
- 877E7A
Renk uyumları
Tamamlayıcı +180°
- BB603C
Deep Reddish Orange
- 008BAB
≈ Corfu Waters
Analog -30° +30°
- BB603C
Deep Reddish Orange
- BC5969
≈ Candied Apple
- AB6E00
≈ Cookie Dough
Üçlü +120° +240°
- BB603C
Deep Reddish Orange
- 0D9465
≈ Emerald Lake
- 7272C7
≈ Kickstart Purple
Bölünmüş tamamlayıcı +150° +210°
- BB603C
Deep Reddish Orange
- 00908C
≈ Supermint
- 3D80C6
≈ Worn Denim
Dörtlü +90° +180° +270°
- BB603C
Deep Reddish Orange
- 618C34
≈ Maximum Green
- 008BAB
≈ Corfu Waters
- 9665B4
≈ Prickly Purple
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 4.32:1 · APCA Lc 70
Ag
AASiyah üzerinde
WCAG 4.85:1 · APCA Lc 32
En iyi metin rengi: #000000
WCAG 4.85:1 (AA) · APCA Lc 32
Contrast pairs
Kod parçacıkları
CSS
:root {
--deep-reddish-orange: #bb603c;
--deep-reddish-orange-rgb: 187 96 60;
--deep-reddish-orange-oklch: oklch(0.59 0.128 41.6);
}
.element {
color: var(--deep-reddish-orange);
background-color: hsl(17 51% 48%);
border-color: oklch(0.59 0.128 41.6);
}Tailwind CSS v4
@theme {
--color-deep-reddish-orange: #bb603c;
--color-deep-reddish-orange-50: #ffead8;
--color-deep-reddish-orange-100: #ffdbc6;
--color-deep-reddish-orange-200: #ffc3a8;
--color-deep-reddish-orange-300: #efa282;
--color-deep-reddish-orange-400: #dd8361;
--color-deep-reddish-orange-500: #ca653c;
--color-deep-reddish-orange-600: #ab5634;
--color-deep-reddish-orange-700: #894529;
--color-deep-reddish-orange-800: #67311e;
--color-deep-reddish-orange-900: #482114;
--color-deep-reddish-orange-950: #2f1006;
}SCSS
$deep-reddish-orange: #bb603c;
$deep-reddish-orange-rgb: 187, 96, 60;
$deep-reddish-orange-light: mix(#fff, $deep-reddish-orange, 20%);
$deep-reddish-orange-dark: mix(#000, $deep-reddish-orange, 20%);
.element {
color: $deep-reddish-orange;
box-shadow: 0 0 0 2px rgba($deep-reddish-orange, 0.35);
}