Using Flutter

Integrating HugeIcons into your Flutter project is straightforward. This page will guide you through the process of using HugeIcons Flutter components in your application.

Import the Package

Once installed, you can import the HugeIcons package into your Flutter project:

import 'package:hugeicons/hugeicons.dart';

Rendering an Icon

To render an icon, simply use it as a Flutter widget:

import 'package:flutter/material.dart';
import 'package:hugeicons/hugeicons.dart';
 
void main() {
  runApp(MyApp());
}
 
class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('Welcome to HugeIcons'),
        ),
        body: Center(
           child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              HugeIcon(
                icon: HugeIcons.bulk_rounded_abacus,
                color: Colors.red,
                size: 100.0,
              ),
              HugeIcon(
                icon: HugeIcons.duotone_rounded_home_02,
                color: Colors.blue,
                size: 100.0,
              ),
              HugeIcon(
                icon: HugeIcons.stroke_sharp_home_01,
                color: Colors.green,
                size: 100.0,
              ),
            ],
          ),
        ),
      ),
    );
  }
}

In the example above, the HugeIcon widget is included in a Flutter application with custom size and color.

Customizing Icons

You can customize icons further by using the color, size, variant, and type properties:

HugeIcon(
  icon: HugeIcons.bulk_rounded_abacus,
  color: Colors.red,
  size: 100.0,
),

Using React Native Autocomplete