gradient blue backgroundūüöĬ†¬†NewPopover component

Make 

beautiful 

websites regardless of your design experience.

Beautiful, fast and modern React UI library.

npm install @nextui-org/react
Zoey Lang

@zoeylang

Full-stack developer, @getnextui lover she/her ūüéČ

4 Following

97.1K Followers

New

Card example background

Camera

$525

Hero Card background

Available soon.

Themeable

Provides a simple way to customize default themes, you can change the colors, fonts, breakpoints and everything you need.

Fast

Avoids unnecessary styles props at runtime, making it more performant than other UI libraries.

Light & Dark UI

Automatic dark mode recognition, NextUI automatically changes the theme when detects HTML theme prop changes.

Unique DX

NextUI is fully-typed to minimize the learning curve, and provide the best possible developer experience.

theming background

Apply your own

theming 

decisions.

NextUI provides a simple way to customize the default themes, you can change the colors, fonts, breakpoints and everything you need.

NextUI

Modern

Elegant

Retro

Learn more
block placeholder

Do

more.

Write

less code.

NextUI components have been created with the Developer's experience
in mind, avoiding having to import multiple components to display just one.

block placeholder

NextUI

block placeholder

Others

dark mode background

Dark mode

is

effortless.

NextUI comes with a fully well-scaled default dark theme that you can apply to your application with just a few lines of code.

Daily Mix
12 Tracks
Frontend Radio
13:3635:01
Learn more
block placeholder
customization background

Customization made

easy.

Thanks to NextUI is built on top of the amazing CSS-in-JS library Stitches, you can customize any components in several ways eather using the css prop, styled function or native CSS selectors.

theming background

Built-in Stitches

utilities.

NextUI provides a set of out of the box Stitches utilities for speeding up your workflow by abbreviating CSS properties, grouping multiple CSS properties together, or simplifying a tricky syntax.

Property shorthands

Using a shorthand property, you can write more concise and more readable CSS, saving time and energy.

Property bundles are CSS properties that let you set the values of multiple other CSS properties simultaneously.

NextUI provides a set of out of the box Stitches utilities that simplify CSS syntax.

Learn more
block placeholder

Last 

but 

not 

least.

A fully-featured React UI library.

Server side render (SSR)

All NextUI components support cross-browser server-side rendering and provides a simple way to implement it in your project.

Accesible components

NextUI components follow the WAI-ARIA guidelines, provide keyboard support and sensible focus management.

Focus interactions

Focus ring will appear only when user navigates with keyboard or screen reader.

Built-in media queries

NextUI provides a set of common media queries that, along with Stitches breakpoints allow you create responsive layouts faster.

TypeScript based

Build type safe applications, NextUI has a fully-typed API to minimize the learning curve, and help you build applications.

Override components tags

A polymorphic `as` prop is included in all NextUI components.

Critical Path CSS

Since NextUI is based on Stitches, it only injects the styles which are actually used, so your users don't download unnecessary CSS.

Beatifully designed

NextUI components are unique and are not tied to any visual trend or design rule, which makes us unique and of course your projects as well.

Let's make the Web

Prettier

Try it for yourself, and share with us what you've built!

npm install @nextui-org/react

Getting Started

NextUI allows you make beautiful, modern, and fast websites/applications regardless of your design experience.

NextUI + Next.js

NextUI is totally compatible with Next.js you just need to customize the _app.jsx entry file to load the provider.