Adlandırılmış renk · #D2813A
Phoenix Rising
Phoenix Rising, #D2813A: rgb(210 129 58), hsl(28 63% 53%), oklch(0.677 0.131 58.7). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Orange mean? → · Phoenix Rising color name →
#D2813A
oklch(0.677 0.131 58.7)
Renk dönüşümleri
- HEX
- #d2813a
- RGB
- rgb(210 129 58)
- HSL
- hsl(28 63% 53%)
- HWB
- hwb(28 23% 18%)
- OKLCH
- oklch(0.677 0.131 58.7)
- OKLab
- oklab(0.677 0.068 0.112)
- CIE Lab
- lab(61.94 27.91 50.67)
- LCH
- lch(61.94 57.85 61.1)
- CMYK
- cmyk(0% 39% 72% 18%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- D78E51
- DD9B66
- E2A77A
- E7B48D
- EBC0A0
- F0CDB3
- F4D9C6
- F8E6D9
- FBF2EC
Koyu tonlar
- B66F31
- 9B5E28
- 814E20
- 683E18
- 502E10
- 391F09
- 241204
- 100601
- 020100
Gri tonlar
- CA8245
- C2824E
- BA8256
- B2825D
- AA8264
- A2826A
- 9A8270
- 918175
- 89817B
Renk uyumları
Tamamlayıcı +180°
- D2813A
Phoenix Rising
- 36A1DF
≈ Dayflower
Analog -30° +30°
- D2813A
Phoenix Rising
- DC7568
≈ Mettwurst
- B8921C
≈ Faint Gold
Üçlü +120° +240°
- D2813A
Phoenix Rising
- 00B098
≈ Pool Green
- A284DD
≈ Lavender Blossom
Bölünmüş tamamlayıcı +150° +210°
- D2813A
Phoenix Rising
- 00AABD
≈ Bahaman Sea
- 7692E8
≈ Guilliman Blue
Dörtlü +90° +180° +270°
- D2813A
Phoenix Rising
- 57AD69
≈ Algae
- 36A1DF
≈ Dayflower
- C378BF
≈ Gulābī Pink
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 3.02:1 · APCA Lc 57
Ag
AASiyah üzerinde
WCAG 6.94:1 · APCA Lc 45
En iyi metin rengi: #000000
WCAG 6.94:1 (AA) · APCA Lc 45
Contrast pairs
Kod parçacıkları
CSS
:root {
--phoenix-rising: #d2813a;
--phoenix-rising-rgb: 210 129 58;
--phoenix-rising-oklch: oklch(0.677 0.131 58.7);
}
.element {
color: var(--phoenix-rising);
background-color: hsl(28 63% 53%);
border-color: oklch(0.677 0.131 58.7);
}Tailwind CSS v4
@theme {
--color-phoenix-rising: #d2813a;
--color-phoenix-rising-50: #ffedd0;
--color-phoenix-rising-100: #ffdfbc;
--color-phoenix-rising-200: #fec89b;
--color-phoenix-rising-300: #e9a870;
--color-phoenix-rising-400: #d78a48;
--color-phoenix-rising-500: #c46c0b;
--color-phoenix-rising-600: #a65c11;
--color-phoenix-rising-700: #854a0e;
--color-phoenix-rising-800: #64350a;
--color-phoenix-rising-900: #462406;
--color-phoenix-rising-950: #2d1200;
}SCSS
$phoenix-rising: #d2813a;
$phoenix-rising-rgb: 210, 129, 58;
$phoenix-rising-light: mix(#fff, $phoenix-rising, 20%);
$phoenix-rising-dark: mix(#000, $phoenix-rising, 20%);
.element {
color: $phoenix-rising;
box-shadow: 0 0 0 2px rgba($phoenix-rising, 0.35);
}