Dualkit

Overview

Dualkit is a free, open-source toolkit for building Arabic and English products for the Gulf from one codebase. It is split into five parts: agent skills that teach Claude Code and Cursor to build right to left, an npm formatting package, a starter set of bilingual components, a page checker, and a monthly benchmark of how free AI models build Arabic interfaces.

The shadcn registry carries the Starter: eight bilingual UI components plus a shared base, which lean on the @dualkit/format package for money, Hijri dates, phone numbers and IBANs parsed from the digits people type, including Arabic-Indic numerals.

Features

• Bilingual starter components: Amount, Button, DateDisplay, DigitInput, Field, Sheet, Tabs and Toast, built to render correctly in both dir="ltr" and dir="rtl".
• Gulf formats: @dualkit/format renders values such as AED 1,234.50 alongside its Arabic form and converts Hijri dates like 1 Ramadan 1447.
• Arabic digit input: Fields accept Arabic-Indic digits and normalize phone numbers to forms like +971 50 123 4567.
• Agent skills: Four skills (rtl-layout, gulf-formats, type-pairing, bilingual-copy) install as a Claude Code plugin and load when a task needs them.
• Dualkit check: A CLI that scores live pages or lints source against 34 rules covering bidi, layout, icons, type and content.
• Monthly bench: Publishes scores for free AI models building Arabic UI, alone and with Dualkit.

Tech stack

• React, shadcn/ui registry
• @dualkit/format and @dualkit/starter npm packages

Registry

Install via the shadcn CLI registry:

npx shadcn@latest add @dualkit/component-name