Have you ever encountered a situation in your design where there’s a unique icon that isn’t available in the Awesome or Feather icon libraries supported by your App Builder? Probably more than once, right? This is where the Custom icons feature comes in handy.

Features

• Convert SVG to fonts
• Change icon charset
• Change icon name
• Download Flutter dependency and App builder addons

Requirement

• Cirilla v4.0.0 or above
• App builder v4.1.3 or above

Installation steps of a custom icons

Through the created fonts in Generate font icons of admin.appcheap.io site, you can see the steps involved in installing the Custom icons

Generate font icons page image

Steps setting image

Step 1: Prepair icons

You must fill “Font Family” and add icons .svg

Then, click “Generate” to next step

Step 2: Update fonts to App builder

Open App builder page from the left sidebar => Click to Features on the menu bar => Click to Custom icons

In there. Requires you to paste the urls “.css” & “.json” files. separate by line breaks => Click to Save

Note

After save urls, you must refresh App builder site

Final, go customize a template to setting icon from this custom icons and go to latest step

Step 3: Import font to App

Download file “.zip” and unzip it

Then, copy the unzipped folder to cirilla/packages/

Then, import package file cirilla/pubspec.yaml

Final, copy code and add to file cirilla/lib/widgets/cirilla_icon_builder.dart

Video guilde