168 React components. Ship the hard ones today.

45 free under MIT, 123 Pro: data tables, editors, drag-and-drop, command palettes.

Browse componentsSee pricing

Free core ยท Pro from $79, one-time payment

Command AI+ componentCommand AI+ component

Behind this screen

The catalog

Every component, by name.

Works with React 18 and 19, Tailwind CSS 3 and 4, written in TypeScript. Pick a name to open its docs.

45
FreeMIT license
123
Proone-time payment
19
Categoriesfrom inputs to backgrounds

ProFree

Running on this stage

01 / Data & Analytics

Dashboards that are already wired.

A chart that takes live data, KPI tiles with trends, and a table with search, filters, selection, export and paging.

Open the Data Table docs

Advanced Chart componentAdvanced Chart component
KPI Widget tilesKPI Widget tiles
Data Table componentData Table component

Running on this stage

02 / Content & Forms

Editors and inputs people expect.

A rich text editor with a full toolbar, plus the form fields that are tedious to get right: card numbers and international phone numbers.

Open the Rich Text Editor docs

Rich Text Editor componentRich Text Editor component
Credit Card Input componentCredit Card Input component
Phone Number Input componentPhone Number Input component

Running on this stage

03 / Interaction & Gestures

Drag it. Swipe it. Tilt it.

Nothing here moves on its own. Drag cards between lanes, reorder the list, swipe the card, and move the pointer over the last panel.

Open the Kanban docs

Kanban componentKanban component
Draggable List componentDraggable List component
Swipeable Card componentSwipeable Card component
Hover Card 3D and Magnetic Button componentsHover Card 3D and Magnetic Button components

Running on this stage

04 / Effects, Backgrounds & Text

The effects, one at a time.

Backgrounds, effects and text animations ship as components. Pick one from the list, or let the screen play through them.

Browse all backgrounds and effects

Backgrounds

StarfieldParticlesWavesMeteors

Effects

SparklesGlow EffectNeon EffectRippleConfetti

Text animations

Typewriter TextGlitch TextFlip TextMorphing TextWavy TextText Reveal
Starfield
Starfield
A canvas star field with depth and shooting stars.
Read the docs

Running on this stage

Getting started

Three steps to your first component.

1

Install

Add the package to a React project that already uses Tailwind CSS.

npm install @moontra/moonui
2

Import

Components are plain imports. No wrapper, no build plugin.

import { Button } from "@moontra/moonui";
3

Theme

Wrap your app once, then adjust tokens to match your brand.

import { ThemeProvider } from "@moontra/moonui/theme";

Free and Pro

Start free. Add Pro when you need it.

Both columns below are running components. Try them.

Free components: a project settings formFree components: a project settings form

Free

The everyday set, open source.

Enhanced versions of Free componentsNot included
Price$0
UpdatesOpen source releases
LicenseMIT
TemplatesNot included

In the form above

Pro components: Calendar, Timeline, Form Wizard and Image ComparePro components: Calendar, Timeline, Form Wizard and Image Compare

Pro

The components that take weeks to build.

Enhanced versions of Free components20
PriceOne-time payment, from $79
UpdatesLifetime updates
LicenseCommercial license
TemplatesThe 4 live templates

In the panel above

Pricing

Pay once. Keep the updates.

Three plans. The difference is seats and custom component requests.

Professional

For individual developers and freelancers

$79

One-time payment

1 device license

  • 123 Pro components
  • Lifetime updates
  • Commercial license
  • The 4 live templates
  • Documentation and examples
  • Email support
Get Professional
Recommended for teams

Team

For small teams and agencies

$199

One-time payment

10 seats

  • Everything in Professional
  • 10 developer seats
  • Custom component requests: 2 per month
  • 12-hour response target
Get Team

Enterprise

For large teams and organizations

$499

One-time payment

Unlimited seats

  • Everything in Team
  • Unlimited developer seats
  • Custom components: 5 per month
  • 12-hour response target
  • White-label use: no MoonUI attribution required
Get Enterprise

Compare plans in detail

FAQ

Questions, answered.

Start with the 45 free components.

Browse componentsSee pricing

Behind this screen