← All Projects

Vajra UI

2026 · personal · open source

Token driven component library for React Native with runtime theming.

Vajra UIToken driven React Native components
Tech Stack
React NativeTypeScript

Vajra UI is a token driven component library for React Native, published under my Devraj Labs org. The idea is simple: bring your own brand, override what you need, build the rest on top.

The problem

Most React Native apps end up with magic strings scattered through their styles and no real enforcement of the design system. Spacing, colors and radii get typed in by hand, drift apart over time, and nothing catches it. Existing design systems fix the consistency but drag in providers, themes and dependency trees you did not ask for.

How it works

Every visual property maps to a typed design token instead of a raw value. Because the tokens are typed unions, a wrong value fails at compile time rather than showing up wrong on screen.

  • Token first props like p="s-4", bg="primary" and rounded="r-2".
  • Themes built with createVajraTheme, applied by wrapping the app in VajraProvider.
  • Runtime theme switching by rebuilding the theme in state.
  • Custom typography with per platform italic handling, so italics render correctly on both iOS and Android.
  • Tokens readable in code through useVajraTheme().

Vajra UI Core

Underneath sits Vajra UI Core, a separate package I built first. It is around 9 kB, has zero runtime dependencies, and needs no provider. It ships 12 headless layout primitives that wrap the native View, Text and TouchableOpacity with shorthand props:

  • Layout: Box, Row, Col, Center, AbsoluteCenter, Spacer, Separator
  • Text: CoreText, CoreTextInput, CorePressable
  • Utilities: Grid and a useDimensions hook for responsive values

Core works on its own for anyone who just wants the layout shorthand, and Vajra UI is the styled, themeable layer built on top of it.

Status

Active work in progress, with a v1 release targeted for June 2026.

Install

npm install @devraj-labs/vajra-ui