Getting Started with QuixUI

QuixUI is a modern UI component library for React, Next.js, and React Native applications. This guide will help you get started with installing and using QuixUI components in your projects.

Installation

To install QuixUI in your project, run one of the following commands depending on your package manager:

npm install @quixui/react

Or with yarn:

yarn add @quixui/react

Basic Setup

After installing QuixUI, you need to set up the provider at the root of your application:

import { QuixProvider } from '@quixui/react';

function App({ Component, pageProps }) {
  return (
    
      
    
  );
}

Using Components

Now you can import and use any QuixUI component in your application:

import { Button, Card } from '@quixui/react';

function MyComponent() {
  return (
    
      My Awesome App
      
        Welcome to QuixUI
        
          This is a simple example using QuixUI components.
          
        
      
    
  );
}

Theming

QuixUI comes with a built-in theming system. You can customize the default theme:

const theme = {
  colors: {
    primary: '#6366f1',
    secondary: '#1e293b',
    // ...other colors
  },
  fontSizes: {
    small: '0.875rem',
    medium: '1rem',
    large: '1.25rem',
    // ...other sizes
  },
  // ...other theme properties
};

function App({ Component, pageProps }) {
  return (
    
      
    
  );
}

Next Steps

Now that you have QuixUI set up in your project, check out these resources to learn more:

If you have any questions or need help, join our Discord community or open an issue on GitHub.

Introduction

Core Concepts

Components