Getting Started


To install the ElegantUI packages run the following command within your project directory.

# atoms and forms are separate packages
# so feel free to skip the one that is not needed

npm i @elegantui/atoms @elegantui/forms

# OR

pnpm i @elegantui/atoms @elegantui/forms

# OR

yarn add @elegantui/atoms @elegantui/forms


The default styles of this library depends on the package that is being used. To use the default styles, add the following styles import to the root element.

// For atoms package
import '@elegantui/atoms/dist/styles.css';

// For forms package
import '@elegantui/forms/dist/styles.css';

Quick start

Here's a quick example to get you started, it's literally all you need:

import * as React from 'react';
import { Button } from '@elegantui/atoms';
import '@elegantui/atoms/dist/styles.css';

function App() {
  return <Button>Hello Friend</Button>;