命名颜色 · #C4AA27
Citronette
Citronette 即 #C4AA27：rgb(196 170 39)、hsl(50 67% 46%)、oklch(0.74 0.142 97.1)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
What does Yellow mean? → · Citronette color name →
#C4AA27
oklch(0.74 0.142 97.1)
颜色转换
- HEX
- #c4aa27
- RGB
- rgb(196 170 39)
- HSL
- hsl(50 67% 46%)
- HWB
- hwb(50 15% 23%)
- OKLCH
- oklch(0.74 0.142 97.1)
- OKLab
- oklab(0.74 -0.017 0.141)
- CIE Lab
- lab(70.33 0.29 64.82)
- LCH
- lch(70.33 64.82 89.7)
- CMYK
- cmyk(0% 13% 80% 23%)
浅色调 · 深色调 · 灰色调
浅色调
- CAB348
- CFBB61
- D5C477
- DBCC8C
- E1D59F
- E7DDB3
- EDE6C6
- F3EED9
- F9F7EC
深色调
- AA9320
- 917D1A
- 786814
- 61530E
- 4A3F08
- 352D04
- 211B02
- 0E0B01
- 020100
灰色调
- BDA63A
- B6A247
- AF9E51
- A89A5A
- A19662
- 9A9169
- 948D70
- 8D8976
- 86847B
配色和谐
互补色 +180°
- C4AA27
Citronette
- 96A1FF
≈ Cobalite
类似色 -30° +30°
- C4AA27
Citronette
- E59737
≈ Sanskrit
- 92BB51
≈ Early Spring
三角配色 +120° +240°
- C4AA27
Citronette
- 00BEE1
≈ Maldives
- E386CB
≈ Blushed Bombshell
分裂互补色 +150° +210°
- C4AA27
Citronette
- 57B1FF
≈ Tiān Lán Sky
- C291F0
≈ Luminous Lavender
四角配色 +90° +180° +270°
- C4AA27
Citronette
- 00C4B8
≈ Swimmers Pool
- 96A1FF
≈ Cobalite
- F4829B
≈ Xoxo
对比度与无障碍
Ag
Fail白底
WCAG 2.30:1 · APCA Lc 45
Ag
AAA黑底
WCAG 9.12:1 · APCA Lc 57
最佳文字颜色: #000000
WCAG 9.12:1 (AAA) · APCA Lc 57
Contrast pairs
代码片段
CSS
:root {
--citronette: #c4aa27;
--citronette-rgb: 196 170 39;
--citronette-oklch: oklch(0.74 0.142 97.1);
}
.element {
color: var(--citronette);
background-color: hsl(50 67% 46%);
border-color: oklch(0.74 0.142 97.1);
}Tailwind CSS v4
@theme {
--color-citronette: #c4aa27;
--color-citronette-50: #fff7c8;
--color-citronette-100: #f3e9b3;
--color-citronette-200: #e3d68e;
--color-citronette-300: #c9b95e;
--color-citronette-400: #b69e22;
--color-citronette-500: #a18400;
--color-citronette-600: #887000;
--color-citronette-700: #6d5a00;
--color-citronette-800: #524100;
--color-citronette-900: #392d00;
--color-citronette-950: #231900;
}SCSS
$citronette: #c4aa27;
$citronette-rgb: 196, 170, 39;
$citronette-light: mix(#fff, $citronette, 20%);
$citronette-dark: mix(#000, $citronette, 20%);
.element {
color: $citronette;
box-shadow: 0 0 0 2px rgba($citronette, 0.35);
}