لوحة Amber Color Palette

Amber Color Palette built around #FFBF00, a light warm yellow anchor (WCAG contrast 1.65:1 against white). The set combines a light tint + a deep shade + a softened complement + a neutral ground. Its strongest pairing is #FFE6A1 on #395DC6 at 4.81:1, which meets WCAG AA for body text.

أصفردافئزاهٍجذب الانتباه
#FFBF00
#FFE6A1
#845E00
#395DC6
#DDA60D
#ffbf00 #ffe6a1 #845e00 #395dc6 #dda60d
#FFBF00 #FFE6A1 #845E00 #395DC6 #DDA60D

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

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

background#FFE6A1
surface#FFBF00
text#395DC6
text-muted#845E00
primary#FFBF00
secondary#845E00
accent#DDA60D

متغيّرات CSS

:root {
  --background: #ffe6a1;
  --surface: #ffbf00;
  --text: #395dc6;
  --text-muted: #845e00;
  --primary: #ffbf00;
  --secondary: #845e00;
  --accent: #dda60d;
}
معاينة في الواجهات →

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

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

النص \ الخلفية#FFBF00#FFE6A1#845E00#395DC6#DDA60D
#FFBF00
1.0
1.3
3.5
3.6
1.3
#FFE6A1
1.3
1.0
4.8
4.8
1.8
#845E00
3.5
4.8
1.0
1.0
2.7
#395DC6
3.6
4.8
1.0
1.0
2.7
#DDA60D
1.3
1.8
2.7
2.7
1.0

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

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

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

لوحات مشابهة

أسئلة شائعة

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

انسخ متغيّرات CSS أدناه إلى :root واستخدم var(--primary) وvar(--background) وغيرها. اللوحة كاملة: #FFBF00, #FFE6A1, #845E00, #395DC6, #DDA60D.

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

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

Amber Color Palette — #FFBF00 #FFE6A1 #845E00 #395DC6 #DDA60D — Tintiva