التباعد عنصر رئيسي لتوضيح الشكل والتدرج.
رموز
Name
Size
Pixels
0
0px
0px
px
1px
1px
0.5
2px
1
4px
1.5
6px
2
8px
2.5
10px
3
12px
3.5
14px
4
1rem
16px
5
20px
6
24px
7
28px
8
2rem
32px
9
2.25rem
36px
10
2.5rem
40px
11
2.75rem
44px
12
3rem
48px
14
3.5rem
56px
16
4rem
64px
20
5rem
80px
24
6rem
96px
28
7rem
112px
32
8rem
128px
36
9rem
144px
40
10rem
160px
44
11rem
176px
48
12rem
192px
52
13rem
208px
56
14rem
224px
60
15rem
240px
64
16rem
256px
نحن ننسق رموزنا مع مقياس الفضاء الافتراضي لـ Tailwind ، والذي يستند إلى شبكة 8 نقاط وتقسيماتها.
نقوم بتعيين رموز المسافات المطبقة للعلاقات بين العناصر لعلاج المسافات بطريقة أكثر دلالة. وهذا يعني أن العلاقة بين العنوان الفرعي والبطاقة على الصفحة ستكون دائمًا هي نفسها، مما يخلق شعورًا بالألفة والفهم لأي شخص يستخدم المنتج. يتعرف المستخدم على ما يتوقعه، ويكتسب الثقة ويستنتج المعنى من المرئيات فقط.
للتعرف على كيفية استخدامنا للمتغيرات الجديدة في Figma لتحقيق ذلك، تحقق من المقالة أدناه.