Compliance
Every component, matched to the Platforms Code.
Each @dev-dga component is matched to its official DGA Platforms Code page, with a status. So you can check the fidelity yourself, not take our word for it.
What this page claims, and what it doesn’t.
It covers Platforms Code components only. It tracks coverage: whether each component has the same parts, variants, and states as the official one. It does not claim exact pixel and token values, that check is separate and still running. Components with no official page are listed as extensions, and we don’t claim them as DGA-compliant.
- 48
- components aligned
- 49
- official pages covered
- 16
- library extensions
Legend
- AlignedMatches the official component’s parts, variants, and states.
- PartialCovered, with some gaps.
- ExtensionOur own component. No official page, and not claimed as DGA-compliant.
Actions
| Platforms Code page | dev-dga component | Status |
|---|---|---|
| Buttons | Button | Aligned |
| Floating button | FloatingButton | Aligned |
| Link | Link | Aligned |
| Content switcher | ContentSwitcher | Aligned |
Inputs - text
| Platforms Code page | dev-dga component | Status |
|---|---|---|
| Text input | TextInput | Aligned |
| Textarea | Textarea | Aligned |
| Number input | NumberInput | Aligned |
| Search box | SearchBox | Aligned |
| File upload | FileUpload | Aligned |
Inputs - selection
| Platforms Code page | dev-dga component | Status |
|---|---|---|
| Checkbox | Checkbox | Aligned |
| Radio | Radio | Aligned |
| Switch | Switch | Aligned |
| Dropdown input | Dropdown | Aligned |
| Slider | Slider | Aligned |
| Rating | Rating | Aligned |
| Date picker | DatePicker | Aligned |
| Date picker (range) | DateRangePicker | Aligned |
Feedback & status
| Platforms Code page | dev-dga component | Status |
|---|---|---|
| Inline alert | InlineAlert | Aligned |
| Notification | Notification | Aligned |
| Notification toast | NotificationToast | Aligned |
| Chip | Chip | Aligned |
| Tags | Tag | Aligned |
| Status tag | StatusTag | Aligned |
| Progress bar | Progress · CircularProgress | Aligned |
| Radial stepper | CircularProgress (segments) | Partial |
| Progress indicator | ProgressIndicator | Aligned |
| Loading | Spinner | Aligned |
| Skeleton | Skeleton | Aligned |
| Tooltip | Tooltip · HelpIcon | Aligned |
Data display
| Platforms Code page | dev-dga component | Status |
|---|---|---|
| Accordions | Accordion | Aligned |
| Table | Table | Aligned |
| List | List | Aligned |
| Structured list | StructuredList | Aligned |
| Metric | Metric | Aligned |
| Avatar | Avatar | Aligned |
| Quote | Quote | Aligned |
| Card | Card | Aligned |
| Charts | PieChart · LineChart · BarChart | Aligned |
| Carousel | Carousel | Aligned |
| Code snippet | CodeSnippet | Aligned |
| Digital stamp | DigitalStamp | Aligned |
Overlays
| Platforms Code page | dev-dga component | Status |
|---|---|---|
| Modals | Modal | Aligned |
Layout & utility
| Platforms Code page | dev-dga component | Status |
|---|---|---|
| Divider | Divider | Aligned |
Two kinds of match
Same parts, variants, and states as the official component. That’s what this page tracks.
Pixel, color, and token measurements against the official file. A separate check, still running.
Extensions
Components we add beyond the official spec. They have no official Platforms Code page, so we don’t claim them as DGA-compliant.
dev-dga is an independent library, maintained by the community. It is not affiliated with, nor endorsed by, the Saudi Digital Government Authority (DGA).
See it live, not just in a table.