Iconography System

Iconography System

Icons are a key visual element that help convey information quickly and effectively. We use them to enhance the user experience, simplify content, and ensure visual consistency across all products.

Icon Style

We use line-based icons with a clean and modern style that aligns with the overall tone of our brand identity. Icons are designed to be Clear and easy to understand Consistent in size and stroke weight Adaptable to various sizes and design contexts

Usage

Standard Size: Icons are used at [specify size, e.g., 24px or 32px].
Colors: Icons follow the brand's official color palette, with optional use of grayscale or a single color when needed.
Spacing: Adequate spacing is maintained around each icon to ensure clarity and prevent visual clutter.

Restrictions

Do not distort the icon’s proportions.
Do not recolor icons with colors outside the official brand palette.
Do not apply effects (e.g., shadows, glows) unless specified in the brand guidelines.

Icon Library

All icons are available in [SVG / PNG / Webfont] formats.

النظام البصري للأيقونات

النظام البصري للأيقونات

الأيقونات هي عنصر بصري أساسي يساعد في إيصال المعلومات بسرعة وفعالية، نستخدمها لتعزيز تجربة المستخدم، وتبسيط المحتوى، وتحقيق اتساق بصري في جميع المنتجات.

أسلوب الأيقونات (Style)

نستخدم أيقونات خطية بأسلوب بسيط وحديث يتماشى مع الطابع العام لهويتنا البصرية، يتم تصميم الأيقونات لتكون واضحة وسهلة الفهم، متسقة في الحجم والسُمك، وقابلة للتكيّف مع أحجام وتصاميم متعددة.

الاستخدام

الحجم القياسي: يتم استخدام الأيقونات بالحجم [حدد الحجم مثل 24px أو 32px].

الألوان: تعتمد الأيقونات على لوحة الألوان الرسمية للعلامة، مع إمكانية استخدام تدرج رمادي أو لون واحد عند الحاجة.

المسافات: نُراعي وجود مسافة كافية حول كل أيقونة لضمان وضوحها وعدم تداخلها مع العناصر الأخرى.

الممنوعات

عدم تغيير أبعاد الأيقونة بشكل غير متناسب.

عدم إعادة تلوين الأيقونة بألوان خارج لوحة العلامة.

عدم إضافة تأثيرات (مثل الظل أو التوهج) إلا إن تم تحديده مسبقًا ضمن الإرشادات.

مكتبة الأيقونات

جميع الأيقونات متوفرة بصيغة [SVG / PNG / Webfont].