Fluent UI System Icons, brought to you by Microsoft, offer a modern and friendly collection of icons that can elevate the user interface of any application. This guide will help you navigate the installation and usage of Fluent UI System Icons across different platforms, ensuring you integrate these icons smoothly into your projects.

Table of Contents

• Icon List
• Installation
• Contributing
• Demo Apps
• Troubleshooting

Icon List

You can access the complete spectrum of icons in the following categories:

• View the full list of regular icons
• View the full list of filled icons

Installation

Integrating Fluent UI System Icons into your application varies based on the platform: Android, iOS/macOS, and Flutter. Below are detailed instructions for each.

Android

To get started with Android:

repositories {
    ...
    mavenCentral()
}

dependencies {
    implementation 'com.microsoft.design:fluent-system-icons:1.1.260@aar'
}

Make sure to consult the library documentation in androidREADME.md for further guidance.

iOS and macOS

For installation via CocoaPods, add the following to your Podfile:

use_frameworks!
pod 'FluentIcons', '1.1.260'

For Carthage users, use the following command:

git clone git@github.com:microsoftfluentui-system-icons.git --branch 1.1.260

Refer to iosREADME.md for more documentation.

Flutter

In your Flutter project, modify the pubspec.yaml file to include:

dependencies:
  ...
  fluentui_system_icons: ^1.1.260

For additional Flutter documentation, visit flutterREADME.md.

Plain SVG

You can also utilize the icons as inline SVGs. Detailed instructions are available at packagessvg-iconsREADME.md.

Contributing

If you’re looking to contribute, the importer generates the Android and iOS libraries from the icon assets. To set it up:

cd importer
npm install
npm run clean
# List all available commands
npm run

Your contributions can help enhance this collection!

Demo Apps

You can build and run demo apps by following these steps:

Android

1. Run the command npm run deploy:android in the importer directory.
2. Open the android directory in Android Studio.
3. Select the sample-showcase in the build configuration dropdown.
4. Click run.

Flutter

Prerequisite: Ensure you have Flutter configured in Android Studio.

1. Open the flutter directory in Android Studio.
2. Select the example in the directory and open it.
3. Click run.

Troubleshooting

Encounter issues during installation or implementation? Here are some common troubleshooting tips:

• Ensure you have the correct version mentioned in your dependency entries.
• Check network connectivity for fetching packages.
• Review any error messages carefully to pinpoint the issue.

For more insights, updates, or to collaborate on AI development projects, stay connected with fxis.ai.

Conclusion

At fxis.ai, we believe that such advancements are crucial for the future of AI, as they enable more comprehensive and effective solutions. Our team is continually exploring new methodologies to push the envelope in artificial intelligence, ensuring that our clients benefit from the latest technological innovations.