نظام التصميم الموحد (DGA) Platforms Code
نظام تصميم الحكومة السعودية، على هيئة مكوّنات React تنسخها إلى مشروعك
رموز DGA ومكوّنات Base UI وتخطيطات تبدأ من العربية، تُثبَّت في مشروعك عبر سطر أوامر shadcn. الشيفرة ملكك، وكل زوج لوني فيها مفحوص وفق WCAG AA.
npx shadcn@latest init https://dga.omqkhafi.dev/r/dga.jsonتجديد العنوان الوطني
حدّث العنوان المرتبط برقم هويتك الوطنية.
Request received
We will message you within 2 working days.
مكوّنات حية: بدّل اللغة والسمة من الأعلى. الحقول عناصر HTML عادية إلى أن تصدر مكوّنات النماذج.
المكوّنات
تركيبات صغيرة مبنية من الأجزاء التي تثبّتها
التثبيت
ثلاثة أوامر، والشيفرة المصدرية في مشروعك
- 1
أنشئ تطبيقًا
أي مشروع React مع Tailwind CSS v4. تستخدم هذه الخطوات Next.js.
npx create-next-app@latest my-app - 2
أضف نمط DGA
يضبط الرموز والخط والاتجاه من اليمين إلى اليسار ونمط Base UI في components.json.
npx shadcn@latest init https://dga.omqkhafi.dev/r/dga.json - 3
أضف مكوّنًا
ينسخ الشيفرة المصدرية إلى components/ui. عدّلها كما تعدّل شيفرتك.
npx shadcn@latest add @dga/button
مفتوح المصدر
يُبنى علنًا
الشيفرة المصدرية
المكوّنات والرموز وسكربتات الفحص في مستودع واحد. باب المشكلات وطلبات الدمج مفتوح.
omqkhafi/dga (opens in a new tab)الإصدار 0.2.0
يُدوَّن كل إصدار في سجل التغييرات قبل نشره، مع ما تغيّر وسببه.
اقرأ سجل التغييراترخصة MIT
استخدمه في المشاريع التجارية والحكومية. احتفظ بنص الرخصة. علامة DGA وشعارها ملك لهيئة الحكومة الرقمية.
اقرأ الرخصة (opens in a new tab)