RelateUI

A free and open-source UI Kit for React, built with Tailwind CSS and Storybook, designed specifically for Relate products.

Table of Contents

• Overview
• Features
• Installation
• Usage
• Components
• Customization
• Contributing
• License

Overview

RelateUI is a comprehensive UI Kit designed to provide a consistent and visually appealing user experience across all Relate products. Built with Tailwind CSS for rapid development and Storybook for easy component exploration, RelateUI offers a wide range of styled brand components to help you get started with your project quickly.

Features

• Tailwind CSS integration: Leverage the power of Tailwind CSS for rapid development and customization.
• Storybook support: Easily explore and interact with components using Storybook.
• Styled brand components: Get started with a set of pre-designed, styled components tailored to the Relate brand.
• Highly customizable: Tailor the UI Kit to your needs using Tailwind CSS's configuration options.
• Open-source: Contribute to the project and help shape the future of RelateUI.

Installation

To install RelateUI, run the following command:

npm install @relatecom/relateui

Or, if you're using yarn:

yarn add @relatecom/relateui

Usage

Import RelateUI in your React project and start using its components:

import React from 'react';
import "@relatecom/relateui/style.css"
import { Button } from '@relatecom/relateui';

function App() {
  return (
    <div>
      <Button>Click me!</Button>
    </div>
  );
}

Components

RelateUI offers a wide range of components, including:

• Buttons: Primary, secondary, and tertiary buttons with various styles.
• Inputs: Text inputs, password inputs, and number inputs with custom styles.
• Cards: Cards with different layouts and styles.
• Alerts: Success, warning, and error alerts.
• Modals: Modal windows with various styles and layouts.

Customization

RelateUI is highly customizable using Tailwind CSS's configuration options. You can adjust the colors, typography, spacing, and more to fit your project's needs.

Contributing

We welcome contributions to RelateUI! If you'd like to contribute, please fork the repository and submit a pull request.

License

RelateUI is released under the MIT License. See the LICENSE file for details.

Roadmap

• [ ] Add more components to the UI Kit.
• [ ] Improve documentation and examples.
• [ ] Enhance customization options using Tailwind CSS.

Community

Join our community to discuss RelateUI, share your experiences, and get help from other users:

• GitHub Discussions

We're excited to have you on board!