Flexicon Flutter

A comprehensive Flutter icon library featuring beautiful duotone SVG icons organized by categories. This library provides over 1,000+ high-quality icons perfect for modern Flutter applications.

Features

• 🎨 1,000+ Duotone SVG Icons - Beautiful, consistent icon design
• 📱 Flutter Optimized - Built specifically for Flutter applications
• 🗂️ Organized Categories - Icons grouped by functionality and use case
• 🎯 Easy to Use - Simple API with helper methods
• 🎨 Customizable - Support for custom colors and sizes
• 📦 Lightweight - Only includes necessary dependencies

Categories

• Alerts & Feedback - Notifications, alerts, and user feedback icons
• Arrows - Navigation and directional arrows
• Charts - Data visualization and chart icons
• Communication - Mail, phone, chat, and messaging icons
• Development - Code, programming, and development tools
• Editor - Text editing and content creation icons
• Education - Learning and educational icons
• Files - File management and document icons
• Finance & eCommerce - Money, shopping, and business icons
• General - Common UI elements and general purpose icons
• Images - Photo, gallery, and media icons
• Layout - Grid, list, and layout icons
• Legal Icons - Legal and compliance related icons
• Maps & Travel - Location, navigation, and travel icons
• Media & Devices - Audio, video, and device icons
• Security - Lock, shield, and security icons
• Shapes - Geometric shapes and design elements
• Time - Clock, calendar, and time-related icons
• Users - User profiles, groups, and people icons
• Weather - Weather conditions and climate icons

Installation

Add this to your package's pubspec.yaml file:

dependencies:
  flexicon_flutter:
    git:
      url: https://github.com/apptimus/flexicon-flutter.git

Or if you want to use it locally:

dependencies:
  flexicon_flutter:
    path: ../path/to/flexicon_flutter

Then run:

flutter pub get

Usage

API Integration (Recommended)

For easy integration with your API response format:

import 'package:flexicon_flutter/flexicon_flutter.dart';

// Your API response
final category = {
  "id": 1,
  "name": "Civil Law",
  "slug": "civil-law", 
  "description": "Property disputes, Rental agreements, etc.",
  "icon": "legal-document-01",
  "sort_order": 1
};

// Get icon widget directly from API data
final iconWidget = LibertyIconsAPI.getCategoryIconWithFallback(
  category['icon'] as String?,
  size: 24,
  color: Colors.blue,
);

// Use in your UI (always returns a valid widget)
IconButton(
  icon: iconWidget,
  onPressed: () {},
)

Basic Usage

import 'package:flutter/material.dart';
import 'package:flexicon_flutter/flexicon_flutter.dart';

class MyWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('My App'),
        actions: [
          IconButton(
            icon: LibertyIcons.svg(
              AlertsFeedbackIcons.bell01,
              size: 24,
              color: Colors.white,
            ),
            onPressed: () {},
          ),
        ],
      ),
      body: Center(
        child: Column(
          children: [
            // Using helper methods
            AlertsFeedbackIcons.alertCircleIcon(
              size: 48,
              color: Colors.red,
            ),
            SizedBox(height: 16),
            // Using direct SVG path
            LibertyIcons.svg(
              ArrowsIcons.arrowUp,
              size: 32,
              color: Colors.blue,
            ),
          ],
        ),
      ),
    );
  }
}

Using Category-Specific Icons

import 'package:flexicon_flutter/flexicon_flutter.dart';

// Alerts & Feedback
AlertsFeedbackIcons.alertCircleIcon(color: Colors.red);
AlertsFeedbackIcons.bellIcon(color: Colors.blue);
AlertsFeedbackIcons.thumbsUpIcon(color: Colors.green);

// Arrows
ArrowsIcons.arrowUpIcon(color: Colors.black);
ArrowsIcons.chevronRightIcon(color: Colors.grey);

// General
GeneralIcons.homeIcon(color: Colors.blue);
GeneralIcons.settingsIcon(color: Colors.grey);
GeneralIcons.searchIcon(color: Colors.black);

// Communication
CommunicationIcons.mailIcon(color: Colors.red);
CommunicationIcons.phoneIcon(color: Colors.green);
CommunicationIcons.messageIcon(color: Colors.blue);

Custom Colors and Sizes

// Custom size
LibertyIcons.svg(
  GeneralIcons.heart,
  size: 64,
  color: Colors.red,
)

// Using duotone colors (if supported by the icon)
LibertyIcons.svgDuotone(
  GeneralIcons.star01,
  size: 48,
  primaryColor: Colors.yellow,
  secondaryColor: Colors.orange,
)

In Lists and Grids

ListView.builder(
  itemCount: items.length,
  itemBuilder: (context, index) {
    return ListTile(
      leading: LibertyIcons.svg(
        GeneralIcons.user01,
        size: 24,
        color: Theme.of(context).primaryColor,
      ),
      title: Text(items[index].title),
      trailing: LibertyIcons.svg(
        ArrowsIcons.chevronRight,
        size: 16,
        color: Colors.grey,
      ),
    );
  },
)

Icon Categories and Examples

Alerts & Feedback

• alertCircle, alertTriangle, bell01, notificationBox
• thumbsUp, thumbsDown

Arrows

• arrowUp, arrowDown, arrowLeft, arrowRight
• chevronUp, chevronDown, chevronLeft, chevronRight

General

• home01, settings01, search01, user01
• heart, star01, bookmark01

Communication

• mail01, phone01, message01, chat01
• video01, microphone01

API Reference

LibertyIconsAPI Class (Recommended for API Integration)

Methods

• getCategoryIcon(String iconName, {double? size, Color? color}) - Get icon widget by name
• getCategoryIconWithFallback(String? iconName, {double? size, Color? color}) - Get icon with fallback
• isValidIcon(String iconName) - Check if icon exists
• getCategoryIcons(String categorySlug) - Get all icons for a category
• getFallbackIcon({double? size, Color? color}) - Get fallback icon

LibertyIcons Class

Methods

• svg(String iconPath, {double? size, Color? color}) - Creates an SVG icon widget
• svgDuotone(String iconPath, {double? size, Color? primaryColor, Color? secondaryColor}) - Creates a duotone SVG icon widget
• getIconPath(String category, String iconName) - Helper to get icon path
• getIconPathByName(String iconName) - Get icon path by unique name
• getIconByName(String iconName, {double? size, Color? color}) - Get icon widget by name
• hasIcon(String iconName) - Check if icon exists
• getAllIconNames() - Get all available icon names
• getIconsByCategory(String categorySlug) - Get icons by category slug

Category Classes

Each category has its own class with:

• Static constants for icon paths
• Helper methods for common icons
• Consistent naming conventions

Example App

Check out the example/ directory for a complete Flutter app demonstrating:

• Icon browsing by category
• Custom color selection
• Size adjustment
• Interactive showcase

To run the example:

cd example
flutter run

Contributing

Contributions are welcome! Please feel free to submit a Pull Request.

Development Setup

1. Clone the repository
2. Run flutter pub get in the root directory
3. Run flutter pub get in the example directory
4. Make your changes
5. Test with flutter test
6. Run the example app to verify changes

License

This project is licensed under the MIT License - see the LICENSE file for details.

Acknowledgments

• Icons designed with modern duotone style
• Optimized for Flutter applications
• Inspired by popular icon libraries

Changelog

1.0.0

• Initial release
• 1,000+ duotone SVG icons
• 20 organized categories
• Flutter-optimized implementation
• Example app included