لوحة Pastel Color Palette

خمس درجات باستيل هوائية تمتد على الوردي والأزرق والخوخي والأخضر واللافندر. تشبّع منخفض يُبقي التوليفات لطيفة؛ استخدمها مع مساحة بيضاء للمسة ناعمة وودّية.

باستيلناعمفاتح
#FADADD
#D0E8F2
#FFEFD5
#D9E8D5
#E8D5E8
#fadadd #d0e8f2 #ffefd5 #d9e8d5 #e8d5e8
#FADADD #D0E8F2 #FFEFD5 #D9E8D5 #E8D5E8

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

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

background#FFEFD5
surface#D0E8F2
text#E8D5E8
text-muted#FADADD
primary#D0E8F2
secondary#FADADD
accent#D9E8D5

متغيّرات CSS 

:root {
  --background: #ffefd5;
  --surface: #d0e8f2;
  --text: #e8d5e8;
  --text-muted: #fadadd;
  --primary: #d0e8f2;
  --secondary: #fadadd;
  --accent: #d9e8d5;
}
معاينة في الواجهات →

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

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

النص \ الخلفية#FADADD#D0E8F2#FFEFD5#D9E8D5#E8D5E8
#FADADD
1.0
1.0
1.1
1.0
1.1
#D0E8F2
1.0
1.0
1.1
1.0
1.1
#FFEFD5
1.1
1.1
1.0
1.1
1.2
#D9E8D5
1.0
1.0
1.1
1.0
1.1
#E8D5E8
1.1
1.1
1.2
1.1
1.0

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

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

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

#FADADD
rgb(250, 218, 221)
#D0E8F2
rgb(208, 232, 242)
#FFEFD5
Papayawhip
#D9E8D5
rgb(217, 232, 213)
#E8D5E8
rgb(232, 213, 232)

لوحات مشابهة

Lilac Color Palette
Wheat Color Palette
Sky Blue Color Palette

أسئلة شائعة

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

انسخ متغيّرات CSS أدناه إلى :root واستخدم var(--primary) وvar(--background) وغيرها. اللوحة كاملة: #FADADD, #D0E8F2, #FFEFD5, #D9E8D5, #E8D5E8.

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

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

Pastel Color Palette — #FADADD #D0E8F2 #FFEFD5 #D9E8D5 #E8D5E8 — Tintiva