One system,
Every SDAIA
product.

A unified design language built from the ground up for Saudi Arabia's digital platforms. Token-based, bilingual, AI-compatible, and production-ready.

170+ components. Every state covered.

From core UI primitives to advanced workflows and AI-compatible interfaces.

1

Token Markdown

A single source-of-truth token doc covering color, space, type, motion & radius

Multi-Branding

Swap the entire system's look — colors, type, radius — with a single token override click

Sync

Dev–Design Token Sync

Same token names in Figma and code. Zero drift, zero translation.

AI

Full AI-Compatible Interfaces

Every component ships prompt-ready — token-wired, machine-readable, built for generative UI

85

Unique Components

Core, advanced, marketing & workflow — all in one library

33

SDAIA Exclusive

Components with no equivalent in any baseline system

Built for designers.
Loved by developers.

The same source of truth — one Figma library, one codebase, zero drift.

For Developers

Production-ready code from day one

Every component ships as framework-ready code. Accessible, themeable, and wired to the token layer so you're never hardcoding values.

  • React & Next.js compatible

  • Full token API — no hardcoded values

  • AI-compatible architecture for generative UI

  • Accessibility baked in — WCAG 2.1 AA

  • RTL/LTR layout switching out of the box

import { Button, Navbar } from '@sdaiacomponents';
const theme = 'dark' | 'light';
const t dir = 'rtl' | 'ltr';

For Designers

A Figma library that actually scales

One unified file. Instance slot system with up to 9 swappable slots per row. Every state, every variant — documented with real-screen examples.

  • 170+ component sets in a single Figma file

  • Up to 9 swappable instance slots per component

  • Every state: Default • Hover • Pressed • Disabled

  • Full anatomy diagrams with spacing annotations

  • Do ✔ and Don't ✘ usage examples per component

2 Figma LibraryComponents • Icons↳ Documentation Portal

Ready to build
with SDAIA DS?

Request access to the Figma library, developer docs, and onboarding session for your team.

SDAIA

Saudi Data & AI Authority · Kingdom of Saudi Arabia · Built by Nacew Inc · 2026

Terms & Conditions