لوحة Cream Color Palette

Cream Color Palette built around #FFFDD0, a light warm neutral anchor (WCAG contrast 1.04:1 against white). The set combines a light tint + a deep shade + a softened complement + a neutral ground. Its strongest pairing is #FFFFEA on #7E7D60 at 4.16:1, which does NOT meet WCAG AA (4.5:1) for body text — use it for large text or non-text UI only.

محايدمحايددافئناعم
#FFFDD0
#FFFFEA
#7E7D60
#DBDCF4
#DDDBB4
#fffdd0 #ffffea #7e7d60 #dbdcf4 #dddbb4
#FFFDD0 #FFFFEA #7E7D60 #DBDCF4 #DDDBB4

الأدوار الدلالية

تُسنَد تلقائياً: الأفتح = الخلفية، الأغمق = النص، الأكثر تشبّعاً = اللون الأساسي.

background#FFFFEA
surface#FFFDD0
text#7E7D60
text-muted#DDDBB4
primary#DDDBB4
secondary#FFFDD0
accent#DBDCF4

متغيّرات CSS

:root {
  --background: #ffffea;
  --surface: #fffdd0;
  --text: #7e7d60;
  --text-muted: #dddbb4;
  --primary: #dddbb4;
  --secondary: #fffdd0;
  --accent: #dbdcf4;
}
معاينة في الواجهات →

مصفوفة إمكانية الوصول

لون النص (الصفوف) على الخلفية (الأعمدة). الأخضر = اجتياز WCAG AA للنص العادي (≥4.5:1).

النص \ الخلفية#FFFDD0#FFFFEA#7E7D60#DBDCF4#DDDBB4
#FFFDD0
1.0
1.0
4.0
1.3
1.4
#FFFFEA
1.0
1.0
4.2
1.3
1.4
#7E7D60
4.0
4.2
1.0
3.1
3.0
#DBDCF4
1.3
1.3
3.1
1.0
1.1
#DDDBB4
1.4
1.4
3.0
1.1
1.0

تحت عمى اللون الأخضر-الأحمر

محاكاة Machado وزملائه (2009)، شدة 1.0 — تقدير تقريبي وليست أداة طبية.

ألوان هذه اللوحة

لوحات مشابهة

أسئلة شائعة

كيف أستخدم Cream Color Palette في CSS؟

انسخ متغيّرات CSS أدناه إلى :root واستخدم var(--primary) وvar(--background) وغيرها. اللوحة كاملة: #FFFDD0, #FFFFEA, #7E7D60, #DBDCF4, #DDDBB4.

هل تجتاز هذه الألوان فحوصات إمكانية الوصول؟

راجع مصفوفة WCAG في هذه الصفحة: كل اقتران نص-على-خلفية بنسبة ≥ 4.5 يجتاز AA للنص العادي؛ و≥ 3 يجتاز AA للنص الكبير ومكوّنات الواجهة.

Cream Color Palette — #FFFDD0 #FFFFEA #7E7D60 #DBDCF4 #DDDBB4 — Tintiva