命名颜色 · #FFB162
Burning Flame
Burning Flame 即 #FFB162：rgb(255 177 98)、hsl(30 100% 69%)、oklch(0.82 0.132 64.5)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
What does Orange mean? → · Burning Flame color name →
#FFB162
oklch(0.82 0.132 64.5)
颜色转换
- HEX
- #ffb162
- RGB
- rgb(255 177 98)
- HSL
- hsl(30 100% 69%)
- HWB
- hwb(30 38% 0%)
- OKLCH
- oklch(0.82 0.132 64.5)
- OKLab
- oklab(0.82 0.057 0.119)
- CIE Lab
- lab(78.76 23.78 51.65)
- LCH
- lch(78.76 56.86 65.3)
- CMYK
- cmyk(0% 31% 62% 0%)
浅色调 · 深色调 · 灰色调
浅色调
- FFB974
- FFC185
- FFC995
- FFD1A5
- FFD9B4
- FFE1C3
- FFE8D2
- FFF0E1
- FFF7F0
深色调
- DE9954
- BE8347
- 9E6C3A
- 80572D
- 634221
- 482F16
- 2E1C0B
- 160C03
- 030100
灰色调
- F2AC67
- E5A86C
- D8A370
- CC9E73
- BF9976
- B29479
- A68F7B
- 998A7D
- 8D857F
配色和谐
互补色 +180°
- FFB162
Burning Flame
- 8DCBFF
≈ Clear Sky
类似色 -30° +30°
- FFB162
Burning Flame
- FFAC98
≈ Discreet Orange
- E0C355
≈ Cream Gold
三角配色 +120° +240°
- FFB162
Burning Flame
- 3DDFCE
≈ Fresh Turquoise
- D4B2FF
≈ Light Violet
分裂互补色 +150° +210°
- FFB162
Burning Flame
- 3CD9F8
≈ Berta Blue
- B2C0FF
≈ Dried Lilac
四角配色 +90° +180° +270°
- FFB162
Burning Flame
- 78DD9D
≈ Enchanted Emerald
- 8DCBFF
≈ Clear Sky
- F8A3E7
≈ Lavender Rose
对比度与无障碍
Ag
Fail白底
WCAG 1.79:1 · APCA Lc 33
Ag
AAA黑底
WCAG 11.71:1 · APCA Lc 70
最佳文字颜色: #000000
WCAG 11.71:1 (AAA) · APCA Lc 70
Contrast pairs
代码片段
CSS
:root {
--burning-flame: #ffb162;
--burning-flame-rgb: 255 177 98;
--burning-flame-oklch: oklch(0.82 0.132 64.5);
}
.element {
color: var(--burning-flame);
background-color: hsl(30 100% 69%);
border-color: oklch(0.82 0.132 64.5);
}Tailwind CSS v4
@theme {
--color-burning-flame: #ffb162;
--color-burning-flame-50: #ffefce;
--color-burning-flame-100: #ffe0ba;
--color-burning-flame-200: #fbca98;
--color-burning-flame-300: #e5aa6c;
--color-burning-flame-400: #d48c41;
--color-burning-flame-500: #c17000;
--color-burning-flame-600: #a35f00;
--color-burning-flame-700: #834c01;
--color-burning-flame-800: #623602;
--color-burning-flame-900: #452503;
--color-burning-flame-950: #2c1300;
}SCSS
$burning-flame: #ffb162;
$burning-flame-rgb: 255, 177, 98;
$burning-flame-light: mix(#fff, $burning-flame, 20%);
$burning-flame-dark: mix(#000, $burning-flame, 20%);
.element {
color: $burning-flame;
box-shadow: 0 0 0 2px rgba($burning-flame, 0.35);
}