Open source · MIT · Built in India

Components built for Bharat.

IndiaCN is an open-source, copy-paste React component library based on UX4G 2.0 — the design language used for India's public digital services. ShadCN-compatible, accessible by default, and free forever under MIT.

A community initiative — not affiliated with the Government of India.

25+components
WCAG 2.1 AAaccessibility
7semantic scales
21type styles
components/button.tsx
Live preview
The library

25+ accessible components. Copy, paste, ship.

Every component is built on Radix UI primitives, styled with Tailwind v4, and tested against WCAG 2.1 AA. The source lives in your repo — no black-box dependency.

View all components
Buttonbutton.tsx
VerifiedPendingRejectedDraftIn review
Badgebadge.tsx
Aadhaar number
1234 5678 ____
Format valid
Inputinput.tsx

Application details

Tabstabs.tsx
Verification72%
Documents45%
Progressprogress.tsx
PAN
Aadhaar
Driving Licence
Voter ID
Passport
Chipchip.tsx
Document uploaded successfully2s
Toasttoast.tsx
KA
PR
SM
+4
Avatar groupavatar.tsx
AccordionAlertBadgeBreadcrumbButtonButton GroupCardChipCollapseDropdownList GroupModalOffcanvasPaginationPopoverProgressSearchSeparatorSkeletonSpinnerStepperTabsToastTooltipTypography
Install

One shadcn add away.

IndiaCN ships as a ShadCN-compatible registry — not an npm package. Install the theme once, then add components one at a time. Each one lands as source code in your repo: no runtime dependency, no version lock.

01
Run shadcn init in your project

Tailwind CSS v4 required — uses @theme inline.

02
Add the IndiaCN theme preset

Brings semantic scales, focus rings, dark mode, keyframes.

03
Add components by registry URL

Dependencies (theme, typography, …) auto-resolve.

~/your-app
# 1. Add the IndiaCN theme
$ npx shadcn@latest add
https://indiacn.in/r/theme.json

# 2. Add components
$ npx shadcn@latest add @indiacn/button
$ npx shadcn@latest add @indiacn/card @indiacn/dropdown

✓ Theme tokens, focus rings, dark mode installed
✓ button, card, dropdown ready in components/ui/
Why IndiaCN

Designed for the realities of Indian users.

Most component libraries are built for SaaS dashboards. IndiaCN is built for eKYC flows, ration-card portals, scholarship forms, and citizen services — at scale across India.

WCAG 2.1 AA

Every component ships with proper ARIA, keyboard navigation, visible focus rings, and reduced-motion support. Tested with screen readers.

UX4G 2.0 themed

Token-based theme aligned with UX4G 2.0: semantic scales for primary, secondary, success, danger, warning, info, plus neutral and alert.

Copy, don't depend

Source lands in your repo. No runtime, no version lock, no surprise breakage. Fork it, theme it, ship it on your terms.

Tokens

Semantic scales, not brand colors.

Seven semantic scales — primary, secondary, neutral, success, danger, warning, info. Each ramps 50 → 900 with a matched dark-mode pair. Drop in your own primary; the rest adapts.

primary#613af5
50
100
200
300
400
500
600
700
800
secondary#938bb6
50
100
200
300
400
500
600
700
800
success#3c9718
50
100
200
300
400
500
600
700
800
danger#b7131a
50
100
200
300
400
500
600
700
800
warning#b77224
50
100
200
300
400
500
600
700
800
info#00aaff
50
100
200
300
400
500
600
700
800
neutral#212121
50
100
200
300
400
500
600
700
800
Use cases

Built for the surfaces that matter.

From eKYC and document upload to citizen dashboards and grievance portals — the patterns that move 1.4 billion people through digital services every day.

See all components
eKYC verificationAadhaar, PAN, DigiLocker
Citizen dashboardSchemes, applications, status
Grievance portalFile, track, escalate
Form workflowsMulti-step, validated flows
Payment & receiptsUPI, challan, invoice
Status trackingSteppers, timelines, alerts
Community

A movement, not a library.

IndiaCN is built in the open, by Indian developers, designers, and accessibility advocates. Star the repo, file an issue, ship a component — every contribution shapes the standard.

25+Components
MITLicense — forever free
WCAG2.1 AA compliant
EarlyPlanning phase

“IndiaCN is in early planning. Suggest a component, file an issue, or open a PR — every contribution shapes the standard.”

— From the project README