Updated for 2026 MIT · React Native · v1.7.1

Build products that feel
native by default.

Native-UI is a cross-platform React Native design system by POLPROG - shipping native-feeling components on iOS and Android with production-grade visual polish out of the box.

Get started View on GitHub

Today

Tuesday, 14 Jan

Steps +12%
8,420
Focus time +6%
2h 14m
Upcoming
Design review · 10:00
Stand-up · 11:30
1:1 with Sam · 14:00
Runs on
  • iOS 15+
  • Android 7+
  • Expo SDK 50+
  • React Native 0.74+
  • New Architecture ready
40
Components & primitives
188
Passing unit tests
100%
TypeScript strict
2
Density presets

Why Native-UI

Everything a product team needs
to ship a polished app.

Opinionated defaults. Unopinionated APIs. Zero-config visual parity - native on iOS, native on Android.

Native-grade polish, out of the box

A compact-density typography preset tuned for iOS and Android. Pairs with Space Grotesk or any font you ship.

43 production components

34 components + 9 primitives covering every screen surface - Buttons, Inputs, Sheets, Toasts, List rows, Skeletons, Confetti and beyond.

Theme-driven design tokens

One typed token system for colors, typography, spacing, radii and elevation. Swap themes, density or brand without touching component code.

Typography density presets

Regular (iOS-native 17pt) and Compact (15pt headline) presets with correct line-heights, tracking and weight families preconfigured.

Accessibility baked in

Accessible roles, labels, hit-slops, focus management and reduced-motion support are defaults - not opt-ins.

iOS & Android, one API

Platform-aware behaviours (haptics, safe areas, modals, gestures) unified behind a single prop surface - works on both platforms without conditional code.

188 unit tests, strictly typed

Every component is fully typed in TypeScript strict mode and covered by an extensive Jest suite - so consumers upgrade without fear.

Tree-shakeable & tiny

Published as ESM + CJS with individual component exports. Ship only what your screen actually imports.

Components

40 pieces. One visual language.

Every surface a product needs - composed from the same theme, tokens and motion system.

Preview theme

Buttons

Chips

Today Week Month Custom

Input

Badges & Avatars

AM NU New 3

Skeleton

Toast

Changes saved successfully.

Card

Monthly budget 3

2,450 of 3,000

Toggle

Notifications
Weekly digest

List

Profile John Doe
Language English

Progress

0%

Button playground

…and 34 more. Browse the full catalog →

Typography

A type scale tuned for apps.

Ten variants with iOS-correct sizes, line-heights and tracking - plus a compact preset for content-dense screens. Pairs with Space Grotesk or any font you ship.

displayLarge 34 / 41 / 700
Native by default
displayMedium 28 / 34 / 700
Design system, shipped
h1 28 / 34 / 600
Section title
h2 22 / 28 / 600
Subsection
title 17 / 22 / 600
Card headline
bodyLarge 17 / 22 / 500
Emphasised body text
body 17 / 22 / 400
Body - the default reading size used throughout the design system.
bodySmall 15 / 20 / 400
Subheadline used for list subtitles and secondary text.
label 13 / 18 / 500
Form label
overline 11 / 13 / 600
SECTION OVERLINE

Design tokens

One source of truth for every pixel.

Colors, spacing, radii, elevation - typed, themeable, and accessible from every component.

Colors

Spacing

xs 4px
sm 8px
md 12px
lg 16px
xl 24px
2xl 32px
3xl 48px

Radii

sm 6px
md 10px
lg 14px
xl 20px
full 9999px

Install

Ship your first screen
in under a minute.

Drop in the provider, import components, done. No config, no theme-writing, no token-wrangling required.

Read the docs View on npm
App.tsx 
import { NativeUIProvider, Button, Card, Heading, Stack } from '@polprog/native-ui';

export default function App() {
  return (
    <NativeUIProvider>
      <Card>
        <Stack gap="lg">
          <Heading level={1}>Welcome</Heading>
          <Button variant="primary" onPress={handlePress}>
            Get started
          </Button>
        </Stack>
      </Card>
    </NativeUIProvider>
  );
}

The difference

Raw React Native vs. Native-UI

Concern Raw React Native Native-UI
Typography scale DIY per screen 10 pre-tuned variants · 2 density presets
Design tokens Manual StyleSheet constants Strongly-typed theme · swap in one line
Accessibility Opt-in per component Labels · roles · hit-slop · reduce-motion by default
Platform parity Platform.select scattered everywhere Unified props, platform behaviours encapsulated
Forms & inputs Build label / helper / error states yourself Input, TextArea, Select, Checkbox, Radio, Switch ready
Motion & haptics Install & wire up separately PressableScale, Toast, Confetti, Skeleton - built-in
Visual consistency Drifts across screens / teams Production-grade parity enforced by tokens
Test safety net Your responsibility 188 unit tests shipped with the library

In production

Used in production by PhotoToPuzzle

PhotoToPuzzle is a privacy-first photo puzzle game for iOS, Android, iPad, and Android tablets. It is built on Native-UI and uses the library across buttons, cards, modals, inputs, theme tokens, spacing, and adaptive layouts. The app works fully offline, keeps photos on-device, and shows how Native-UI supports real mobile products across phones and tablets.

  • Production app
  • iOS + Android
  • Phone + Tablet
  • Offline-first
  • Built with Native-UI
View PhotoToPuzzle on POLPROG ↗

Ready to ship something that feels native?

Install Native-UI and spend your time on product, not pixels.

Read the docs Star on GitHub
Expo React Native 0.74+ iOS Android Web TypeScript Accessible