لون مسمّى · #EFB57A
Surprise Amber
Surprise Amber هو #EFB57A: rgb(239 181 122)، hsl(30 79% 71%)، oklch(0.814 0.101 66.1). شاهد الدرجات الفاتحة والداكنة والتناسقات وتباين WCAG وAPCA وأكواد CSS وTailwind v4 وSCSS.
What does Orange mean? → · Surprise Amber color name →
#EFB57A
oklch(0.814 0.101 66.1)
تحويلات الألوان
- HEX
- #efb57a
- RGB
- rgb(239 181 122)
- HSL
- hsl(30 79% 71%)
- HWB
- hwb(30 48% 6%)
- OKLCH
- oklch(0.814 0.101 66.1)
- OKLab
- oklab(0.814 0.041 0.093)
- CIE Lab
- lab(78.18 16.67 38.54)
- LCH
- lch(78.18 41.99 66.6)
- CMYK
- cmyk(0% 24% 49% 6%)
درجات فاتحة · درجات داكنة · درجات رمادية
درجات فاتحة
- F1BD88
- F3C496
- F5CBA3
- F7D3B0
- F8DABE
- FAE2CB
- FBE9D8
- FDF0E5
- FEF8F2
درجات داكنة
- D09D69
- B18659
- 946F49
- 78593A
- 5C442B
- 42301D
- 2A1D10
- 140C05
- 030201
درجات رمادية
- E4B07C
- D8AB7D
- CDA57E
- C2A07F
- B79B7F
- AC9580
- A19080
- 968B80
- 8B8580
تناسق الألوان
متمم +180°
- EFB57A
Surprise Amber
- 8BC9FF
≈ Platonic Blue
متجاور -30° +30°
- EFB57A
Surprise Amber
- FCAB94
≈ No Way Rosé
- D5C274
≈ Citrus Yellow
ثلاثي +120° +240°
- EFB57A
Surprise Amber
- 6CD7CC
≈ Turquoise Twist
- D2B1F6
≈ Light Violet
متمم منقسم +150° +210°
- EFB57A
Surprise Amber
- 6DD3EC
≈ Middle Blue
- B1BDFF
≈ Dried Lilac
رباعي +90° +180° +270°
- EFB57A
Surprise Amber
- 8AD6A7
≈ Green Ash
- 8BC9FF
≈ Platonic Blue
- ECA9DB
≈ Pretty Pink Piggy
التباين وإمكانية الوصول
Ag
Failعلى الأبيض
WCAG 1.81:1 · APCA Lc 34
Ag
AAAعلى الأسود
WCAG 11.56:1 · APCA Lc 69
أفضل لون للنص: #000000
WCAG 11.56:1 (AAA) · APCA Lc 69
Contrast pairs
مقتطفات الأكواد
CSS
:root {
--surprise-amber: #efb57a;
--surprise-amber-rgb: 239 181 122;
--surprise-amber-oklch: oklch(0.814 0.101 66.1);
}
.element {
color: var(--surprise-amber);
background-color: hsl(30 79% 71%);
border-color: oklch(0.814 0.101 66.1);
}Tailwind CSS v4
@theme {
--color-surprise-amber: #efb57a;
--color-surprise-amber-50: #fff0d7;
--color-surprise-amber-100: #ffe2c4;
--color-surprise-amber-200: #f2cda6;
--color-surprise-amber-300: #daae7f;
--color-surprise-amber-400: #c7925b;
--color-surprise-amber-500: #b37734;
--color-surprise-amber-600: #97652e;
--color-surprise-amber-700: #795124;
--color-surprise-amber-800: #5b3a19;
--color-surprise-amber-900: #3f2810;
--color-surprise-amber-950: #281603;
}SCSS
$surprise-amber: #efb57a;
$surprise-amber-rgb: 239, 181, 122;
$surprise-amber-light: mix(#fff, $surprise-amber, 20%);
$surprise-amber-dark: mix(#000, $surprise-amber, 20%);
.element {
color: $surprise-amber;
box-shadow: 0 0 0 2px rgba($surprise-amber, 0.35);
}