Command Palette

Search for a command to run...

Make your App Look
Like a Series B
Company

Fleet UI is a Production-Ready UI SDK based on minimalism and fluid animations.

Animation
DX
Design System
Copy & Paste

Mobile First Designed Components

Every component comes with polished micro-interactions.
Trendy & Fluid animations are applied to every interactive component by default.

OTP Input

Slider

Tab Bar

Swiper

Action Button

Menu

Input

Toast

For production teams

Ship Faster With Production Quality

Minimal runtime, strong types, and consistent motion—out of the box.

Zero runtime overhead

Theme-driven styles resolve fast without runtime bloat with Unistyles

Easy to theme

Layered token architecture and variants system makes it easy to customize theme with consistent design.

Type-safe by default

Strong interfaces keep tokens and components consistent.

Native Based Motion

Built for smooth, consistent animation on the UI thread with Reanimated.

Flexible State control

Uncontrolled by default, controlled when you need it.

Composable & Override-friendly

Composable building blocks that fit your workflow and override-friendly.

Design Faster with
Built-in Variants

Mix and match props to create any style. Type-safe, consistency.

Preview Code
<Button
  variant="filled"
  colorScheme="primary"
  rounded="md"
  shadow="none"
/>
Live Preview

INSTALLATION

Choose your installation Track

Pick the model that matches your team: a shadcn-style local install for full ownership, or a package install for a stable, versioned workflow.

Crafted Color System

11-step scales for every intent. Light and dark themes out of the box.

1234567891011
Primary
Success
Warning
Error
Info
Neutral

TOKEN PIPELINE

Your design system, not ours

A clear pipeline from Raw → Primitive → Semantic → Theme.
Change once, propagate everywhere—with type safety.

tokens/raw.ts
Raw

const lightColorScale = {
  '1': '#0098ff',  // ← Just a color value
  ...
  '11': '#0069bb',
};

const darkColorScale = {
  '1': '#0069bb',
  ...
  '11': '#0098ff',
};

export const rawColors = {
  neutral: {
    light: lightColorScale,
    dark: darkColorScale,
  },
  primary: {
    // ...
  },
  // ... other colors
};

Ready to Ship Beautiful Apps?

Start building in minutes. No configuration needed. Join developers who care about design quality.