Are You Tired Of Importing Icons To Your Flutter App?

By Galip Erkin Doruk Full Stack Developer, Etrexio

3 min readFeb 7, 2023

The project designer just finished the new project, and you are about to start coding. You are assigning custom colors, shadows, gradients, and assets. When it comes to importing custom icons, it takes time to create variables for each icon by navigating through all icon files in the folder.

Using a shell script to extract file names may help you to import icons easily. Navigating to the icon files directory and running the following command creates the .txt file with file names.

ls -1 > filenames.txt

Once you get the file names, you can copy-paste them into a new dart file with a class named AppIcons and by the multi-line selection you can import icons.

Please be careful of special words. For example, do not name icon names as false.svg or import. svg. Use false_icon.svg or true_icon.svg as the naming of icon files.

Another easy way to import custom icons is to download the file and run it in the same directory as your SVG files. It will create a class named AppIcons in app_icons.dart file, create variables with “static const String” type, and assign SVG files to corresponding variables.



# File to write output to


# Create filenames file

ls -1 | grep .svg$ > filenames.txt

# Create output file

echo “class AppIcons {“ > $output_file

# Read filenames from file

while read filename; do

# Convert filenames to lowerCamelCase

varname=$(echo “$filename” | awk ‘{print tolower(substr($0,1,1)) substr($0,2)}’ | sed ‘s/\.[^.]*$//’ | sed ‘s/_\([a-z]\)/\u\1/g’)

# Add the output to the output file

echo “ static const String $varname = ‘assets/icons/$filename’;” >> $output_file

done < filenames.txt

# Close output file

echo “}” >> $output_file


You can also copy the bash script above, paste it on your text editor and save it as Do not forget to give execute permission to the file. You can do it by “chmod +x”.

After you create the file and give execute permission, run the script by “./” command on the terminal.

I generated the bash scripts in this content using ChatGPT. My prompts to create the final bash script are as follows,

- hi there, can you write a terminal command to copy file names to a .txt file?

- how to create variables from file names in filenames.txt file with camel case style. for example static const String overviewFilled = ‘assets/icons/overview_filled.svg’;

- how to save the output to AppIcons class in the dart file?

- how to make this bash script executable?

- how to combine two bash scripts to create AppIcons class in dart by first generating file names with .svg extension, then creating variables and saving the output in AppIcons class?

-can you make the variable names lowerCamelCase and output file name app_icons.dart

- thank you so much!




Startup Creation House 🚀We help you grow as an entrepreneur | startups 💡 Useful tips for UXDesigners & Developers