​
Requirements

Before installing Hux UI, ensure your development environment meets these requirements:

​
Installation

​
Method 1: Using Flutter Command Line

Add Hux UI to your Flutter project using the command line: 
flutter pub add hux
This will automatically add the latest version of Hux UI to your pubspec.yaml file and run flutter pub get.

​
Method 2: Manual Installation

Alternatively, you can manually add Hux UI to your pubspec.yaml file:
pubspec.yaml
dependencies:
  flutter:
    sdk: flutter
  hux: ^0.4.0  # Use the latest version
Then run: 
flutter pub get

​
Import and Setup

​
1. Import Hux UI

Import Hux UI in your Dart files where you want to use the components: 
import 'package:hux/hux.dart';
This single import gives you access to all Hux UI components and utilities.

​
2. Configure Themes

Wrap your MaterialApp with Hux UI themes for the best experience:
main.dart
import 'package:flutter/material.dart';
import 'package:hux/hux.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'My Hux UI App',
      
      // Configure light theme
      theme: HuxTheme.lightTheme,
      
      // Configure dark theme  
      darkTheme: HuxTheme.darkTheme,
      
      // Optional: Set theme mode
      themeMode: ThemeMode.system, // Follows system theme
      
      home: MyHomePage(),
    );
  }
}

​
3. Start Using Components

You’re now ready to use Hux UI components in your app: 
class MyHomePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('Hux UI Demo')),
      body: Padding(
        padding: EdgeInsets.all(16),
        child: Column(
          children: [
            HuxButton(
              onPressed: () => print('Button pressed!'),
              child: Text('Primary Button'),
              variant: HuxButtonVariant.primary,
            ),
            SizedBox(height: 16),
            HuxCard(
              title: 'Welcome to Hux UI',
              child: Text('This is a Hux UI card component.'),
            ),
          ],
        ),
      ),
    );
  }
}

​
Verification

To verify that Hux UI is properly installed and working:

​
1. Check Dependencies

Ensure these dependencies are listed in your pubspec.yaml: 
dependencies:
  hux: ^0.2.1
  flutter:
    sdk: flutter

​
2. Test Import

Create a simple test to verify the import:
test.dart
import 'package:hux/hux.dart';

void main() {
  // If this compiles without errors, Hux UI is properly installed
  final button = HuxButton(
    onPressed: () {},
    child: Text('Test'),
  );
  print('Hux UI installed successfully!');
}

​
3. Run Your App

Start your Flutter app: 
flutter run
If you see Hux UI components rendering correctly, the installation is complete!

​
Troubleshooting

​
Next Steps

Now that Hux UI is installed, you can:

Follow the Quickstart

Learn the basics with our quickstart guide

Explore Components

Discover all available UI components

Learn Theming

Customize themes and design tokens

View Examples

See practical implementation examples

​
Package Information