命名颜色 · #DDAA33
Currywurst
Currywurst 即 #DDAA33:rgb(221 170 51)、hsl(42 71% 53%)、oklch(0.766 0.141 84)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度,以及 CSS、Tailwind v4 和 SCSS 代码。
What does Orange mean? → · Currywurst color name →
#DDAA33
oklch(0.766 0.141 84)
颜色转换
- HEX
- #ddaa33
- RGB
- rgb(221 170 51)
- HSL
- hsl(42 71% 53%)
- HWB
- hwb(42 20% 13%)
- OKLCH
- oklch(0.766 0.141 84)
- OKLab
- oklab(0.766 0.015 0.14)
- CIE Lab
- lab(72.96 11.39 64.37)
- LCH
- lch(72.96 65.37 80)
- CMYK
- cmyk(0% 23% 77% 13%)
浅色调 · 深色调 · 灰色调
浅色调
- E1B350
- E4BC67
- E8C47C
- EBCD90
- EFD5A3
- F2DEB6
- F5E6C8
- F9EEDB
- FCF7ED
深色调
- C0932B
- A47D23
- 88681C
- 6E5314
- 553F0D
- 3D2D07
- 261B03
- 110B01
- 020100
灰色调
- D3A642
- CAA24E
- C19E57
- B79A5F
- AE9666
- A5926C
- 9B8D72
- 928977
- 89857C
配色和谐
互补色 +180°
- DDAA33
Currywurst
- 8CB2FF
≈ Kitten’s Eye
类似色 -30° +30°
- DDAA33
Currywurst
- F79855
≈ Holland Tulip
- B2BC46
≈ Hopscotch
三角配色 +120° +240°
- DDAA33
Currywurst
- 00CAD9
≈ Jade Glass
- DF92E5
≈ Bright Lilac
分裂互补色 +150° +210°
- DDAA33
Currywurst
- 3DC0FE
≈ Megaman
- B8A1FF
≈ Diva
四角配色 +90° +180° +270°
- DDAA33
Currywurst
- 1ECFAC
≈ Mint Leaf
- 8CB2FF
≈ Kitten’s Eye
- F78BB9
≈ Cochonnet
对比度与无障碍
Ag
Fail白底
WCAG 2.12:1 · APCA Lc 42
Ag
AAA黑底
WCAG 9.87:1 · APCA Lc 61
最佳文字颜色: #000000
WCAG 9.87:1 (AAA) · APCA Lc 61
Contrast pairs
代码片段
CSS
:root {
--currywurst: #ddaa33;
--currywurst-rgb: 221 170 51;
--currywurst-oklch: oklch(0.766 0.141 84);
}
.element {
color: var(--currywurst);
background-color: hsl(42 71% 53%);
border-color: oklch(0.766 0.141 84);
}Tailwind CSS v4
@theme {
--color-currywurst: #ddaa33;
--color-currywurst-50: #fff3c8;
--color-currywurst-100: #fde5b2;
--color-currywurst-200: #efd18d;
--color-currywurst-300: #d8b25d;
--color-currywurst-400: #c69622;
--color-currywurst-500: #b27b00;
--color-currywurst-600: #966800;
--color-currywurst-700: #785300;
--color-currywurst-800: #5a3c00;
--color-currywurst-900: #3f2900;
--color-currywurst-950: #281700;
}SCSS
$currywurst: #ddaa33;
$currywurst-rgb: 221, 170, 51;
$currywurst-light: mix(#fff, $currywurst, 20%);
$currywurst-dark: mix(#000, $currywurst, 20%);
.element {
color: $currywurst;
box-shadow: 0 0 0 2px rgba($currywurst, 0.35);
}