Skip to content
Platform Codeالعربية

Introduction

What Platform Code is, how it relates to the DGA design system, and what is in the registry today.

Version 0.2.0 ·

Platform Code is a shadcn registry for the DGA unified design system (Platforms Code, منصات الكود الموحد). You install components with the shadcn CLI. The source is copied into your project, so you can change it.

DGA tokens in a service page
Direction
Theme
Viewport

Principles

  • Figma is the source of truth. Every token comes from the DGA Foundations Figma file. Where the published site CSS disagrees, Figma wins.
  • Correct by default. Every foundation colour pair meets WCAG 2.1 AA in light and dark mode. Where DGA's values fall short, we fix them and log the change on Deviations from DGA.
  • Arabic first. Layouts use logical properties only (ms-*, pe-*, start-*), so a single component works in RTL and LTR.
  • The current shadcn pattern. Components are built on Base UI and use stable semantic classes (cn-button, cn-button-variant-*). The dga style maps those classes to DGA tokens at build time.

What's included

dga-styleTokens (light, dark, responsive), the Tailwind v4 theme, the shadcn variable mapping and IBM Plex Sans Arabic.
FoundationsColors, Typography, Spacing, Radius, Shadows and Icons.
ComponentsButton, Link, Badge, Tag and Status Tag, Avatar, Featured Icon, Spinner, Skeleton and Divider. Forms, overlays and navigation follow in the roadmap.

Status

Platform Code is an independent project and not an official DGA product. It follows the public DGA guidelines and Figma kits, and lists every place where it differs.