Skip to content


Switch branches/tags

Name already in use

A tag already exists with the provided branch name. Many Git commands accept both tag and branch names, so creating this branch may cause unexpected behavior. Are you sure you want to create this branch?

Latest commit


Git stats


Failed to load latest commit information.

nature logo

Set of Lightview and fully customizable React Components optimized for TailwindCss

Nature UI provides a set of accessible, reusable, extensible and composable React components that make it super easy to create websites and apps with tailwindcss.

Looking for the documentation? 📝

Latest version (v1) =>

Features 🚀

  • Ease of Styling: Nature UI contains a set of layout components like Box and Stack that make it easy to style your components with tailwindcss and emotion css prop.
  • Flexible & composable: Nature UI components are built on top of a React UI Primitive for endless composability.
  • Accessible. Nature UI components follow the WAI-ARIA guidelines specifications and have the right aria-* attributes.

Installing Nature UI

To use Nature UI components, all you need to do is install the @nature-ui/core package and its peer dependencies:

Make Sure you have tailwindcss setup in your project

$ yarn add @nature-ui/core

# or

$ npm install @nature-ui/core


import { Button } from '@nature-ui/core';

function Example() {
  return <Button>You're awesome</Button>;

CodeSandbox Templates


Feel like contributing? That's awesome! We have a contributing guide to help guide you.


Thanks goes to these wonderful people (emoji key):

Divine Hycenth

💻 🖋 🎨 📖 🚧 📢

This project follows the all-contributors specification. Contributions of any kind welcome!


MIT © Divine Hycenth