命名颜色 · #FEA051
Bittersweet
Bittersweet 即 #FEA051:rgb(254 160 81)、hsl(27 99% 66%)、oklch(0.787 0.146 58.2)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度,以及 CSS、Tailwind v4 和 SCSS 代码。
What does Orange mean? → · Bittersweet color name →
#FEA051
oklch(0.787 0.146 58.2)
颜色转换
- HEX
- #fea051
- RGB
- rgb(254 160 81)
- HSL
- hsl(27 99% 66%)
- HWB
- hwb(27 32% 0%)
- OKLCH
- oklch(0.787 0.146 58.2)
- OKLab
- oklab(0.787 0.077 0.124)
- CIE Lab
- lab(74.67 31.1 55.19)
- LCH
- lch(74.67 63.35 60.6)
- CMYK
- cmyk(0% 37% 68% 0%)
浅色调 · 深色调 · 灰色调
浅色调
- FFAA66
- FFB479
- FFBE8A
- FFC79C
- FFD1AD
- FFDABD
- FFE3CE
- FFEDDE
- FFF6EF
深色调
- DD8B45
- BD763A
- 9E612F
- 804E24
- 633B1A
- 472910
- 2D1907
- 160902
- 030100
灰色调
- F19D59
- E59B60
- D89865
- CC956B
- BF926F
- B38E73
- A68B77
- 99877A
- 8D847D
配色和谐
互补色 +180°
- FEA051
Bittersweet
- 66C4FF
≈ Maya Blue
类似色 -30° +30°
- FEA051
Bittersweet
- FF9A8C
≈ Peach Pink
- E0B333
≈ Super Lemon
三角配色 +120° +240°
- FEA051
Bittersweet
- 00D7BA
≈ Channel Marker Green
- C4A8FF
≈ Purple Hepatica
分裂互补色 +150° +210°
- FEA051
Bittersweet
- 00D1E7
≈ Aztec Turquoise
- 9CB7FF
≈ Truesky Gloxym
四角配色 +90° +180° +270°
- FEA051
Bittersweet
- 71D383
≈ Electric Lettuce
- 66C4FF
≈ Maya Blue
- EC96E8
≈ Diva Mecha
对比度与无障碍
Ag
Fail白底
WCAG 2.02:1 · APCA Lc 39
Ag
AAA黑底
WCAG 10.36:1 · APCA Lc 63
最佳文字颜色: #000000
WCAG 10.36:1 (AAA) · APCA Lc 63
Contrast pairs
代码片段
CSS
:root {
--bittersweet: #fea051;
--bittersweet-rgb: 254 160 81;
--bittersweet-oklch: oklch(0.787 0.146 58.2);
}
.element {
color: var(--bittersweet);
background-color: hsl(27 99% 66%);
border-color: oklch(0.787 0.146 58.2);
}Tailwind CSS v4
@theme {
--color-bittersweet: #fea051;
--color-bittersweet-50: #ffeccc;
--color-bittersweet-100: #ffddb7;
--color-bittersweet-200: #ffc694;
--color-bittersweet-300: #eea567;
--color-bittersweet-400: #dd863b;
--color-bittersweet-500: #cb6800;
--color-bittersweet-600: #ab5900;
--color-bittersweet-700: #894700;
--color-bittersweet-800: #673200;
--color-bittersweet-900: #482200;
--color-bittersweet-950: #2f1100;
}SCSS
$bittersweet: #fea051;
$bittersweet-rgb: 254, 160, 81;
$bittersweet-light: mix(#fff, $bittersweet, 20%);
$bittersweet-dark: mix(#000, $bittersweet, 20%);
.element {
color: $bittersweet;
box-shadow: 0 0 0 2px rgba($bittersweet, 0.35);
}