Vechai UI: A High-quality React UI Components With Tailwind CSS Support


Category: React React Framework | July 14, 2021
Author:vechai
Official Page:Go to website
Last Update:July 14, 2021
License:MIT

Vechai ui component

Description:

Vechai UI is a user interface component for ReactJS that, comes with high-quality React components with built-in dark mode using Tailwind CSS. And, this framework gives you the flexibility to fully customize the theme as per your requirement. Vechai UI is written in Typescript and Tailwind CSS.

How to install and use it?

  1. You will need install it with npm.
npm i @vechaiui/core @vechaiui/react @tailwindcss/forms

Or, you may install it with yarn.

yarn add @vechaiui/core @vechaiui/react @tailwindcss/forms

2. Now, you will need to configure the component. Vechai UI can be configured in tailwind.config.js.

module.exports = {
  mode: "jit",
  purge: [
    // ...
    "./node_modules/@vechaiui/**/*.{js,ts,jsx,tsx}", // path to vechaiui
  ],
  darkMode: "class", // or 'media' or 'class'
  theme: {
    extend: {},
  },
  variants: {
    extend: {},
  },
  plugins: [
    require("@tailwindcss/forms"),
    require("@vechaiui/core"),
  ],
};

3. Basic Usage.

import * as React from "react";
import { VechaiProvider, Button } from "@vechaiui/react";
​
function App() {
  return (
    <VechaiProvider>
      <Button>Hello Vechai</Button>
    </VechaiProvider>
  );
}