لون مسمّى · #605647
Chocolate Cupcake
Chocolate Cupcake هو #605647: rgb(96 86 71)، hsl(36 15% 33%)، oklch(0.458 0.027 78). شاهد الدرجات الفاتحة والداكنة والتناسقات وتباين WCAG وAPCA وأكواد CSS وTailwind v4 وSCSS.
What does Gray mean? → · Chocolate Cupcake color name →
#605647
oklch(0.458 0.027 78)
تحويلات الألوان
- HEX
- #605647
- RGB
- rgb(96 86 71)
- HSL
- hsl(36 15% 33%)
- HWB
- hwb(36 28% 62%)
- OKLCH
- oklch(0.458 0.027 78)
- OKLab
- oklab(0.458 0.006 0.026)
- CIE Lab
- lab(37.22 2.24 10.34)
- LCH
- lch(37.22 10.58 77.8)
- CMYK
- cmyk(0% 10% 26% 62%)
درجات فاتحة · درجات داكنة · درجات رمادية
درجات فاتحة
- 6F6558
- 7E7569
- 8D857A
- 9C968C
- ACA79E
- BCB8B1
- CDC9C4
- DDDBD7
- EEEDEB
درجات داكنة
- 524A3D
- 453E32
- 383228
- 2C271F
- 201C16
- 15120D
- 0A0806
- 030202
- 000000
درجات رمادية
- 635A4D
- 665E52
- 696258
- 6D675D
- 706B63
- 736F69
- 76736F
- 7A7774
- 7D7C7A
تناسق الألوان
متمم +180°
- 605647
Chocolate Cupcake
- 4E5867
≈ Harbour
متجاور -30° +30°
- 605647
Chocolate Cupcake
- 65534B
≈ Bargeboard Brown
- 595948
≈ Monogram
ثلاثي +120° +240°
- 605647
Chocolate Cupcake
- 465C5D
≈ Woodland Night
- 5E5362
≈ Napa Grape
متمم منقسم +150° +210°
- 605647
Chocolate Cupcake
- 485B64
≈ Fiord
- 565566
≈ Blackwater
رباعي +90° +180° +270°
- 605647
Chocolate Cupcake
- 495D55
≈ Cilantro
- 4E5867
≈ Harbour
- 64525A
≈ Sinful
التباين وإمكانية الوصول
Ag
AAAعلى الأبيض
WCAG 7.19:1 · APCA Lc 85
Ag
Failعلى الأسود
WCAG 2.91:1 · APCA Lc 17
أفضل لون للنص: #FFFFFF
WCAG 7.19:1 (AAA) · APCA Lc 85
Contrast pairs
مقتطفات الأكواد
CSS
:root {
--chocolate-cupcake: #605647;
--chocolate-cupcake-rgb: 96 86 71;
--chocolate-cupcake-oklch: oklch(0.458 0.027 78);
}
.element {
color: var(--chocolate-cupcake);
background-color: hsl(36 15% 33%);
border-color: oklch(0.458 0.027 78);
}Tailwind CSS v4
@theme {
--color-chocolate-cupcake: #605647;
--color-chocolate-cupcake-50: #f9f4ed;
--color-chocolate-cupcake-100: #ede7de;
--color-chocolate-cupcake-200: #dad3c8;
--color-chocolate-cupcake-300: #bfb6a8;
--color-chocolate-cupcake-400: #a79d8d;
--color-chocolate-cupcake-500: #908473;
--color-chocolate-cupcake-600: #7a7061;
--color-chocolate-cupcake-700: #625a4e;
--color-chocolate-cupcake-800: #484138;
--color-chocolate-cupcake-900: #322d26;
--color-chocolate-cupcake-950: #1e1a15;
}SCSS
$chocolate-cupcake: #605647;
$chocolate-cupcake-rgb: 96, 86, 71;
$chocolate-cupcake-light: mix(#fff, $chocolate-cupcake, 20%);
$chocolate-cupcake-dark: mix(#000, $chocolate-cupcake, 20%);
.element {
color: $chocolate-cupcake;
box-shadow: 0 0 0 2px rgba($chocolate-cupcake, 0.35);
}