لوحة Branding Color Palette

لون هوية تركوازي مميّز، وقاعدة محايدة، ولمسة ذهبية — مدى كافٍ لنظام علامة كامل دون إضعاف اللون التوقيعي. المراسي: #0F766E، #F9FAFB، #D4AF37.

هويةهويةراقٍ
#0F766E
#F9FAFB
#D4AF37
#9CC0BB
#A1A1A5
#0f766e #f9fafb #d4af37 #9cc0bb #a1a1a5
#0F766E #F9FAFB #D4AF37 #9CC0BB #A1A1A5

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

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

background#F9FAFB
surface#9CC0BB
text#0F766E
text-muted#A1A1A5
primary#D4AF37
secondary#9CC0BB
accent#A1A1A5

متغيّرات CSS 

:root {
  --background: #f9fafb;
  --surface: #9cc0bb;
  --text: #0f766e;
  --text-muted: #a1a1a5;
  --primary: #d4af37;
  --secondary: #9cc0bb;
  --accent: #a1a1a5;
}
معاينة في الواجهات →

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

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

النص \ الخلفية#0F766E#F9FAFB#D4AF37#9CC0BB#A1A1A5
#0F766E
1.0
5.2
2.6
2.8
2.1
#F9FAFB
5.2
1.0
2.0
1.9
2.5
#D4AF37
2.6
2.0
1.0
1.1
1.2
#9CC0BB
2.8
1.9
1.1
1.0
1.3
#A1A1A5
2.1
2.5
1.2
1.3
1.0

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

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

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

#0F766E
rgb(15, 118, 110)
#F9FAFB
rgb(249, 250, 251)
#D4AF37
rgb(212, 175, 55)
#9CC0BB
rgb(156, 192, 187)
#A1A1A5
rgb(161, 161, 165)

لوحات مشابهة

Logo Color Palette
Summer Color Palette
App UI Color Palette

أسئلة شائعة

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

انسخ متغيّرات CSS أدناه إلى :root واستخدم var(--primary) وvar(--background) وغيرها. اللوحة كاملة: #0F766E, #F9FAFB, #D4AF37, #9CC0BB, #A1A1A5.

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

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

Branding Color Palette — #0F766E #F9FAFB #D4AF37 #9CC0BB #A1A1A5 — Tintiva