Quick start guide

1. Install Tailwind CSS

Pixby UI is a UI library built on top of Tailwind CSS, and is therefore required to be installed first. Please follow the installation instructions provided here.

2. Install package

# yarn

yarn add @pixby/ui

# npm

npm install @pixby/ui

3. Update tailwind.config.js

@pixby/ui uses some custom theme properties that you have to add:

module.exports = {

theme: {

extend: {

colors: {

primary: {

DEFAULT: '#ED6489',

50: '#FFFFFF',

100: '#FFFFFF',

200: '#FDEDF1',

300: '#F8BFCE',

400: '#F292AB',

500: '#ED6489',

600: '#E83666',

700: '#D3184A',

800: '#A5133A',

900: '#770E2A',

},

},

},

},

};

4. Import components

You should now be able to use the library:

import { Button } from '@pixby/ui';