命名颜色 · #FFB95A
Cape Jasmine
Cape Jasmine 即 #FFB95A：rgb(255 185 90)、hsl(35 100% 68%)、oklch(0.834 0.137 72.2)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
What does Orange mean? → · Cape Jasmine color name →
#FFB95A
oklch(0.834 0.137 72.2)
颜色转换
- HEX
- #ffb95a
- RGB
- rgb(255 185 90)
- HSL
- hsl(35 100% 68%)
- HWB
- hwb(35 35% 0%)
- OKLCH
- oklch(0.834 0.137 72.2)
- OKLab
- oklab(0.834 0.042 0.13)
- CIE Lab
- lab(80.54 19.45 57.33)
- LCH
- lch(80.54 60.54 71.3)
- CMYK
- cmyk(0% 27% 65% 0%)
浅色调 · 深色调 · 灰色调
浅色调
- FFC06E
- FFC880
- FFCF91
- FFD6A2
- FFDDB2
- FFE4C2
- FFEBD1
- FFF2E1
- FFF8F0
深色调
- DEA04D
- BE8941
- 9E7135
- 805B29
- 63461E
- 483113
- 2E1E09
- 160D03
- 030200
灰色调
- F2B461
- E5AE67
- D8A86C
- CBA370
- BF9D74
- B29777
- A5927A
- 998C7C
- 8C867E
配色和谐
互补色 +180°
- FFB95A
Cape Jasmine
- A0CDFF
≈ Baby Blue
类似色 -30° +30°
- FFB95A
Cape Jasmine
- FFB497
≈ Island Girl
- DACC57
≈ Advertisement Green
三角配色 +120° +240°
- FFB95A
Cape Jasmine
- 2AE4E0
≈ Bright Turquoise
- E2B3FF
≈ Mauve
分裂互补色 +150° +210°
- FFB95A
Cape Jasmine
- 65D9FF
≈ Athena Blue
- BFC2FF
≈ Light Periwinkle
四角配色 +90° +180° +270°
- FFB95A
Cape Jasmine
- 68E4AD
≈ Medium Aquamarine
- A0CDFF
≈ Baby Blue
- FFA9DE
≈ Fresh Gum
对比度与无障碍
Ag
Fail白底
WCAG 1.70:1 · APCA Lc 30
Ag
AAA黑底
WCAG 12.33:1 · APCA Lc 73
最佳文字颜色: #000000
WCAG 12.33:1 (AAA) · APCA Lc 73
Contrast pairs
代码片段
CSS
:root {
--cape-jasmine: #ffb95a;
--cape-jasmine-rgb: 255 185 90;
--cape-jasmine-oklch: oklch(0.834 0.137 72.2);
}
.element {
color: var(--cape-jasmine);
background-color: hsl(35 100% 68%);
border-color: oklch(0.834 0.137 72.2);
}Tailwind CSS v4
@theme {
--color-cape-jasmine: #ffb95a;
--color-cape-jasmine-50: #fff0ca;
--color-cape-jasmine-100: #ffe2b6;
--color-cape-jasmine-200: #f8cc92;
--color-cape-jasmine-300: #e1ad64;
--color-cape-jasmine-400: #d09033;
--color-cape-jasmine-500: #bc7400;
--color-cape-jasmine-600: #9f6200;
--color-cape-jasmine-700: #804e00;
--color-cape-jasmine-800: #603800;
--color-cape-jasmine-900: #432600;
--color-cape-jasmine-950: #2b1400;
}SCSS
$cape-jasmine: #ffb95a;
$cape-jasmine-rgb: 255, 185, 90;
$cape-jasmine-light: mix(#fff, $cape-jasmine, 20%);
$cape-jasmine-dark: mix(#000, $cape-jasmine, 20%);
.element {
color: $cape-jasmine;
box-shadow: 0 0 0 2px rgba($cape-jasmine, 0.35);
}