ألوان النظام لآي أو إس وأندرويد استعرض ألوان النظام لوياجهات آي أو إس البشرية وتصميم المواد لأندرويد.
ألوان النظام لآي أو إس وأندرويد
استعرض ألوان النظام لوياجهات آي أو إس البشرية وتصميم المواد لأندرويد.
اختر المنصة
حدد iOS (واجهة المستخدم) أو Android (Material 3).
تبديل المظهر
对于 iOS، انتقل بين ألوان الوضع الخفيف والغامق.
نسخ الألوان
انسخ رمز HEX لأي لون نظام.
What Is ألوان النظام لآي أو إس وأندرويد?
يوفر هذا الأداة مرجعًا كاملاً لألوان النظام في iOS و Android - الألوان المحددة مسبقًا التي يوصي بها Apple و Google لبناء التطبيقات الأصلية. تتبع ألوان نظام iOS إرشادات الواجهة البشرية لشركة Apple (HIG) وتشمل أسماء الألوان الدلالية مثل systemBlue و systemRed ومتغيرات systemGray ، كل منها مع قيم وضع الإضاءة الخفيف والغامق المنفصل. تتبع ألوان Android رموز التصميم 3 (Material You) بما في ذلك الألوان الأساسية والثانوية والثالثية وألوان الخطأ والسطح. يضمن استخدام ألوان النظام للأجهزة أن يشعر المستخدم بتطبيقك كتطبيق أصلي ، ويتكيف مع أوضاع المظهر (الضوء / الظلام) ويحافظ على معايير الإمكانية التي حددتها كل منصة. يحفظ هذا المرجع المطورين من الحفر في الوثائق ويكفل لهم استخدام قيم الألوان الدقيقة المحددة بواسطة Apple و Google.
Why Use ألوان النظام لآي أو إس وأندرويد?
-
ألوان النظام الكامل لـ iOS مع متغيرات الوضع الخفيف والغامق
-
رموز التصميم Material 3 لتطوير Android
-
ألوان المنصة الرسمية لمظهر التطبيق الأصلي
-
تبديل بين الوضع الخفيف والغامق (iOS)
-
نسخ واحدة النقر لكل لون
Common Use Cases
تطوير iOS
استخدم قيم ألوان النظام الدقيقة لتطوير Swift/SwiftUI.
تطوير Android
ابحث عن قيم رموز الألوان Material 3 ل Kotlin/Jetpack Compose.
تصميم التطبيقات المتعددة المنصات
قارن بين ألوان النظام لـ iOS و Android عند تصميم تطبيقات متعددة المنصات.
مكتبات Figma/Sketch
تهيئة مكتبات أدوات التصميم بدقة بألوان نظام المنصة.
Technical Guide
تعتبر ألوان نظام iOS ألوان دلالية تتحول تلقائيًا بين مظهر الإضاءة الخفيف والغامق. على سبيل المثال ، يكون systemBlue هو #007AFF في وضع الإضاءة الخفيف و #0A84FF في وضع الظلام - أكثر إشراقاً قليلاً للحفاظ على البصمات المرئية ضد خلفيات مظلمة. يتم تعريف قيم الألوان في إطارات Apple UIKit (UIColor) و SwiftUI (Color). يستخدم Material 3 نظامًا قائمًا على الرموز: الأساسي والثانوي والثالثي للألوان الرئيسية ، والسطح وخلفية للحاويات ، ومتغيرات On-* للمحتوى على تلك السطوح. تم تصميم رموز Material 3 للعمل مع توليد الألوان الديناميكي من خلفيات المستخدم عبر نظام Material You. تختار كلا المنصتين ألوانًا مختلفة قليلاً لوضع الظلام لتحسين سطوعها المتصور وتركيبتها ضد خلفياتهما المظلمة.
Tips & Best Practices
-
1تتكيف ألوان النظام لـ iOS تلقائيًا في الكود - استخدم UIColor.systemBlue بدلاً من رمز HEX المحدد يدويًا
-
2ينبغي استخدام رموز Material 3 عبر MaterialTheme في Jetpack Compose
-
3ألوان الوضع الغامق أغمق قليلاً من ألوان الوضع الخفيف للحفاظ على الوزن البصري على خلفيات غامقة
-
4استخدم الأسماء الدلالية (ألوان النظام) بدلاً من القيم المحددة يدويًا لدعم الوضع الغامق تلقائيًا
-
5يحتوي iOS على ستة مستويات من الرمادي (systemGray إلى systemGray6) لمستويات التسلسل الهرمي المختلفة
Related Tools
مُحَوِّل HEX إلى RGB
قم بتحويل رموز الألوان HEX إلى قيم RGB في الحال مع معاينة مباشرة للعينة.
🎨 Color Tools
محدد اللون
محدد لون تفاعلي مع مخرجات HEX و RGB و HSL و CMYK.
🎨 Color Tools
مفحص نسبة التباين
تحقق من نسب التباين حسب معايير WCAG بين الألوان الأمامية والخلفية.
🎨 Color Tools
لوحات الألوان التجارية
استعرض لوحات الألوان الرسمية من أكثر من 50 علامة تجارية وشركة تقنية شعبية.
🎨 Color Tools
ألوان تصميم المواد
استعرض مجموعة ألوان تصميم المواد الكاملة مع جميع ظلالها واختياراتها.
🎨 Color ToolsFrequently Asked Questions
Q لماذا تكون ألوان الوضع الغامق مختلفة عن ألوان الوضع الخفيف?
Q هل يجب استخدام هذه القيم HEX الدقيقة في الكود الأصلي?
Q هل تتطابق هذه الألوان مع أحدث إصدارات النظام?
About This Tool
ألوان النظام لآي أو إس وأندرويد is a free online tool by FreeToolkit.ai. All processing happens directly in your browser — your data never leaves your device. No registration or installation required.