@vertis-components/components

Production-ready React UI component library with Figma design token integration and Tailwind CSS styling.

Features

• 🎨 Figma Integration: Generate themes directly from Figma design tokens
• 🌗 Dark Mode: Built-in dark mode support with class-based toggle
• 📦 TypeScript: Fully typed components
• ⚡ Tailwind CSS: Utility-first styling
• 🎯 Atomic Design: Organized component structure
• 🔧 Customizable: Override any theme value in your project

Installation

npm install @vertis-components/components

Basic usage

import { Button } from '@vertis-components/components';

function App() {
  return <Button variant="primary">Click me</Button>;
}

For full setup (Tailwind, theme, Figma), see USAGE.md. For live demos and all components, see Storybook.

Quick Start

1. Generate your theme from Figma tokens
2. Configure Tailwind with auto-loaded theme
3. Import styles and start using components

See USAGE.md for complete setup instructions.

Development (Monorepo Contributors)

Start Storybook

To develop components in isolation:

npm run storybook

This will start Storybook at http://localhost:6006.

Build Package

To build the package:

npm run build

Tech Stack

• React + TypeScript
• Tailwind CSS for styling
• Storybook for component development
• tsup for bundling

License

[Your License Here]