لون مسمّى · #F6AFBB
Sweet Caroline
Sweet Caroline هو #F6AFBB: rgb(246 175 187)، hsl(350 80% 83%)، oklch(0.824 0.084 7.9). شاهد الدرجات الفاتحة والداكنة والتناسقات وتباين WCAG وAPCA وأكواد CSS وTailwind v4 وSCSS.
What does Pink mean? → · Sweet Caroline color name →
#F6AFBB
oklch(0.824 0.084 7.9)
تحويلات الألوان
- HEX
- #f6afbb
- RGB
- rgb(246 175 187)
- HSL
- hsl(350 80% 83%)
- HWB
- hwb(350 69% 4%)
- OKLCH
- oklch(0.824 0.084 7.9)
- OKLab
- oklab(0.824 0.083 0.012)
- CIE Lab
- lab(78.61 27.92 4.79)
- LCH
- lch(78.61 28.32 9.7)
- CMYK
- cmyk(0% 29% 24% 4%)
درجات فاتحة · درجات داكنة · درجات رمادية
درجات فاتحة
- F8B7C2
- F9BFC8
- FAC7CF
- FBCFD6
- FCD7DD
- FDDFE3
- FEE7EA
- FEEFF1
- FFF7F8
درجات داكنة
- D698A2
- B7818A
- 986B73
- 7B565C
- 5F4146
- 452E32
- 2C1C1F
- 150B0D
- 030102
درجات رمادية
- EAAAB5
- DEA6AF
- D2A1A9
- C69CA3
- BB989D
- AF9397
- A38E91
- 978A8B
- 8C8586
تناسق الألوان
متمم +180°
- F6AFBB
Sweet Caroline
- 82D7CF
≈ Island Sea
متجاور -30° +30°
- F6AFBB
Sweet Caroline
- EAB1D9
≈ Flower Power
- F6B39E
≈ Mystic Tulip
ثلاثي +120° +240°
- F6AFBB
Sweet Caroline
- B6D095
≈ Haricot
- 9ACBFA
≈ Apocyan
متمم منقسم +150° +210°
- F6AFBB
Sweet Caroline
- 97D7B1
≈ Vista Blue
- 84D3EA
≈ Middle Blue
رباعي +90° +180° +270°
- F6AFBB
Sweet Caroline
- D4C686
≈ Green Apple Martini
- 82D7CF
≈ Island Sea
- B8C1FC
≈ Dried Lilac
التباين وإمكانية الوصول
Ag
Failعلى الأبيض
WCAG 1.78:1 · APCA Lc 33
Ag
AAAعلى الأسود
WCAG 11.76:1 · APCA Lc 70
أفضل لون للنص: #000000
WCAG 11.76:1 (AAA) · APCA Lc 70
Contrast pairs
مقتطفات الأكواد
CSS
:root {
--sweet-caroline: #f6afbb;
--sweet-caroline-rgb: 246 175 187;
--sweet-caroline-oklch: oklch(0.824 0.084 7.9);
}
.element {
color: var(--sweet-caroline);
background-color: hsl(350 80% 83%);
border-color: oklch(0.824 0.084 7.9);
}Tailwind CSS v4
@theme {
--color-sweet-caroline: #f6afbb;
--color-sweet-caroline-50: #ffecf0;
--color-sweet-caroline-100: #ffdde1;
--color-sweet-caroline-200: #f6c6cc;
--color-sweet-caroline-300: #dfa6ae;
--color-sweet-caroline-400: #ca8a95;
--color-sweet-caroline-500: #b66e7b;
--color-sweet-caroline-600: #9a5d69;
--color-sweet-caroline-700: #7b4a54;
--color-sweet-caroline-800: #5b363e;
--color-sweet-caroline-900: #40252b;
--color-sweet-caroline-950: #291318;
}SCSS
$sweet-caroline: #f6afbb;
$sweet-caroline-rgb: 246, 175, 187;
$sweet-caroline-light: mix(#fff, $sweet-caroline, 20%);
$sweet-caroline-dark: mix(#000, $sweet-caroline, 20%);
.element {
color: $sweet-caroline;
box-shadow: 0 0 0 2px rgba($sweet-caroline, 0.35);
}