T4L
Get the appsحمّل التطبيقات
Brand guideدليل الهوية

The T4L brandهوية T4L

The rules every T4L product follows — this website, our apps and our documents. If a product and this page disagree, this page wins.القواعد التي يتبعها كل منتج من T4L: هذا الموقع وتطبيقاتنا ومستنداتنا. وإن اختلف منتج مع هذه الصفحة، فهذه الصفحة هي المرجع.

01 · Logo01 · الشعار

Two letters, one movement.حرفان في حركة واحدة.

What it meansماذا يعني

A T and an L drawn as one movement. The stroke that forms the T sweeps down, loops through the L and rises into an arrow: technology that lifts the people and businesses who use it. The letters are the foundation; the blue arrow is the growth.حرفا T وL مرسومان بحركة واحدة. الخط الذي يشكّل حرف T ينحدر ويلتف حول حرف L ثم يصعد سهماً: تقنية ترفع الناس والأعمال التي تستخدمها. الحرفان هما الأساس، والسهم الأزرق هو النمو.

  • ColoursالألوانInk letters, T4L Blue arrowحروف بلون Ink وسهم بلون T4L Blue
  • Clear spaceالمساحة الفارغة¼ of the logo's widthربع عرض الشعار
  • Minimum sizeأصغر حجم20 px
  • Wordmarkالاسم"T4L" in Unbounded ExtraBold«T4L» بخط Unbounded عريض
T4L
On lightعلى خلفية فاتحة
T4L
On darkعلى خلفية داكنة
T4L
One colourبلون واحد
02 · Colour02 · الألوان

Ink, blue, and a touch of gold.كحلي وأزرق ولمسة ذهبية.

Ink and blue do almost all the work. The brand gradient runs from T4L Blue to cyan for buttons and key words. Gold is a highlight, used sparingly.الكحلي والأزرق يؤديان معظم العمل. وتدرج الهوية يمتد من T4L Blue إلى السماوي للأزرار والكلمات المهمة. أما الذهبي فللإبراز فقط وبقدر محدود.

InkText, letters of the logo, dark surfacesالنصوص وحروف الشعار والخلفيات الداكنة#0B1530
T4L BlueActions, links, the logo's arrowالأزرار والروابط وسهم الشعار#1D5BFF · dark modeالوضع الداكن #5B8EFF
GoldHighlights, "coming soon", cautionsالإبراز و«قريباً» والتنبيهات#D18F0C · dark modeالوضع الداكن #F2B33D
White#FFFFFF
Mist#F5F7FB
Line#E3E8F0
Slate#A3ADC2
Deep#0E1424
Night#070B15
03 · Products and app icons03 · المنتجات وأيقونات التطبيقات

Same tile, different arrow.المربع نفسه، بسهم مختلف.

Every app icon comes in two versions: a white tile with Ink letters for light mode, and an Ink tile with white letters for dark mode. Only the arrow changes colour per product, and that colour is the product's accent inside the app.لكل أيقونة تطبيق نسختان: مربع أبيض بحروف بلون Ink للوضع الفاتح، ومربع بلون Ink بحروف بيضاء للوضع الداكن. ويتغير لون السهم فقط حسب المنتج، وهو نفسه لون الإبراز داخل التطبيق.

T4L OwnerBlue · #1D5BFF
T4L POSGold · #D18F0C
T4L LocalTeal · #0D9484
T4L for SchoolsT4L للمدارسViolet · #6A4CF5
04 · Typography04 · الخطوط

Loud headlines, calm reading.عناوين جريئة، وقراءة مريحة.

Unbounded ExtraBoldEnglish headlines · 800العناوين الإنجليزية · 800
Tech for Lucidity.
Readex Pro BoldArabic headlines · 700العناوين العربية · 700
تقنية للبصيرة.
Readex ProBody · 350 · 16–17 pxالنص · 350 · 16–17 بكسل
Customers pay from their wallet without internet and get their card on the same page.يدفع المشترك من محفظته دون إنترنت، ويصله الكرت في الصفحة نفسها.
JetBrains MonoNumbers, codes, versionsالأرقام والرموز والإصدارات
48213 · 9921 · +500 YER · 0.1.0

Never letter-space Arabic. Use Western digits (0–9) in both languages, as people already see them on their wallets and cards.لا تُضف تباعداً بين الحروف العربية. واستخدم الأرقام 0–9 في اللغتين، فهي ما يراه الناس في محافظهم وكروتهم.

05 · Voice05 · أسلوب الكلام

Talk like a trusted neighbour.تكلّم كجارٍ موثوق.

Warmدافئ

Say "your card", not "the voucher entity". Speak to one person.قل «كرتك» وليس «الكيان المسمى قسيمة». خاطب شخصاً واحداً.

Helpfulمُرشد

When something fails, say what happened and what to do next.عندما يفشل شيء، قل ماذا حدث وما الخطوة التالية.

Confidentواثق

Short sentences, verbs first. No hype, no exclamation marks.جمل قصيرة، والفعل أولاً. بلا مبالغات ولا علامات تعجب.

Clearواضح

Every number shows its unit and where it came from.كل رقم يظهر بوحدته ومصدره.

Doافعل

  • Use the full-colour logo on white or Mist, and the white version on Ink or Night.استخدم الشعار الملوّن على الأبيض أو Mist، والنسخة البيضاء على Ink أو Night.
  • Design every screen in Arabic first, then check it in English.صمم كل شاشة بالعربية أولاً، ثم راجعها بالإنجليزية.
  • Support light and dark mode, following the system by default.ادعم الوضعين الفاتح والداكن، واتبع إعداد النظام افتراضياً.
  • Show money in JetBrains Mono with its currency.اعرض المبالغ بخط JetBrains Mono مع عملتها.

Don'tلا تفعل

  • Recolour the letters, or give the arrow a colour outside the palette.تغيير لون الحروف، أو تلوين السهم بلون من خارج اللوحة.
  • Stretch, rotate or outline the logo, or add shadows to it.مطّ الشعار أو تدويره أو إضافة حدود أو ظلال له.
  • Use gradients outside the blue-to-cyan brand gradient.استخدام تدرجات غير تدرج الأزرق إلى السماوي الخاص بالهوية.
  • Letter-space Arabic or mix Arabic and Latin in one headline.إضافة تباعد بين الحروف العربية، أو خلط العربية واللاتينية في عنوان واحد.

Download the logo.حمّل الشعار.

SVG files for light and dark backgrounds, plus a one-colour version. Unbounded, Readex Pro and JetBrains Mono are free under the SIL Open Font License.ملفات SVG للخلفيات الفاتحة والداكنة، ونسخة بلون واحد. وخطوط Unbounded وReadex Pro وJetBrains Mono مجانية بترخيص SIL Open Font License.

Full colourملوّن For dark backgroundsللخلفيات الداكنة One colourبلون واحد