دليل التصميم الحيّ
مرجع بصري للتوكنز والمكوّنات والثيمين (فاتح/داكن) — عربي، RTL، Mobile First.
الألوان
توكنز الثيم الحالية
Primary
--color-brand-primary
Secondary
--color-brand-secondary
Accent
--color-brand-accent
Background
--color-background
Surface
--color-surface
Border
--color-border
Success
--color-success
Warning
--color-warning
Error
--color-error
Info
--color-info
الخطوط
IBM Plex Sans Arabic / Noto Sans Arabic
Display 1
بسم الله الرحمن الرحيم — منصة علمية إسلامية
Display 2
بسم الله الرحمن الرحيم — منصة علمية إسلامية
عنوان قسم
بسم الله الرحمن الرحيم — منصة علمية إسلامية
متن أساسي
بسم الله الرحمن الرحيم — منصة علمية إسلامية
متن ثانوي
بسم الله الرحمن الرحيم — منصة علمية إسلامية
تسمية صغيرة
بسم الله الرحمن الرحيم — منصة علمية إسلامية
الأزرار
variants + أحجام + حالات
الشارات والبطاقات
Badge, Card, Skeleton
بطاقة درس
مثال على بطاقة محتوى تعليمي
وصف مختصر للدرس مع metadata في RTL.
النماذج
Input, Label, Switch, Tabs
الحركة
Framer Motion — 0.18s standard
بطاقة تفاعلية
حركة هادئة عند التمرير — تحترم prefers-reduced-motion
منصة الشيخ عادل نصر العلمية الإسلامية — نظام التصميم v1.0