SAMPLE APP: Font Awesome Icon Library

[GreenFlux]

AppSheet uses icons from Font Awesome for format rules, actions, views, etc.

But these images aren’t available to choose from when an image column is added to a table. Users can upload new images, but they can’t select from this set of icons- unless they had downloaded them ahead of time.

---

@ipannolinidiAurora asked about using these icons in a table’s image column this morning and it inspired me to build a new sample app.

I found a set of Font Awesome SVGs on GitHub and copied all the names into a new, public GSheet for others to use.

Then, I built a sample app using only the text-name, and a virtual column to retrieve the image:

To add these icons to your app, you can either copy the sample app and build on top of it, or add the public sheet to your app and add a new virtual column:

"https://raw.githubusercontent.com/FortAwesome/Font-Awesome/master/svgs/solid/"&[Name]&".svg"

[MultiTech]

Duuuude!!! Thanks so much @GreenFlux this is amazing!

You don’t know how many times I’ve wanted a way to give my clients the ability to select their own map icons and things - but there was never a good way to get the icons to them.

You da man!

[anonymous]

Awesome Sample App… thank you for sharing!

The search works great & I also love the familiarity with the icons.

[Koichi_Tsuji]

Thank you for sharing and spending bunch of time and works to prepare sample app.
This is super useful.

On the other day, I posted a ONE PAGER image for the list of icons. I took another clean screenshot.
If you are fine, add this file to your sample app as additional resources. Thanks again.

![2021-02-21_14-42-06|600x12500](upload://e81OTEUmTIFpDoNXMBA

flCmfQfS.png)

[Lucinda_Mason]

@GreenFlux and @tsuji_koichi

I want to grab a few of the icons to my app instructions which are contained in my Google sheets data for the app. Is it possible to copy a font awesome icon and insert it in a line of text in a sheet cell?

If so, how?

Thanks.

[Koichi_Tsuji]

GreenFlux:

"https://raw.githubusercontent.com/FortAwesome/Font-Awesome/master/svgs/solid/"&[Name]&".svg

Are you trying to do something like this?

[anonymous]

Hello, is there a way to get the regular and light versions of these icons?

I tried changing the string to regular and light instead of solid. A couple of the icons I was using showed up with the regular version, but most didn’t. When I tried light, none of the icons I’m using showed up.

Just wondering if there are ways to adjust this string to get all of the fonts that are currently available in Appsheet

“https://raw.githubusercontent.com/FortAwesome/Font-Awesome/master/svgs/solid/”&[Name]&“.svg”

Thanks for your help!

[anonymous]

I went and looked on the github website and it looks like the do have additional categories, but not all of them (regular, solid, brands) and they haven’t been updated in a couple of years. Any idea if someone out there could update that list?

[WilliamStrife]

Hi I know it’s been a while since this was posted but I just found it and I hope someone can help me. I’m new to appsheet and not a very fluent english speaker, so I hope I can make myself clear.

I want to use this but I don’t know if I can use it the way I’m intending:

Can this be used as a selection source from the details view?

Let’s say that I’m creating a new task or row, there in the details view there’s an option to upload an image for that row (the camera icon), if you click it it opens a window to take a picture or select a file from the device. Can this be used instead of that?

I checked the sample app and it is a gallery with all the icons displayed, but I don’t understand how I can make it work the way I need

[lventura]

I love it when you think “jeez, it would be useful if…” and some generous soul had the same idea four years ago, and it’s still there and working. I thank you!

[Mathieu_Matek]

This post is old, but still incredibly useful @GreenFlux!

Just for fun and to improve the user search experience, I propose a “boosted” version using Gemini features in Google Sheets.

Here is the result:

Google Sheets Setup

Here is how I set up the columns to generate the keywords automatically:

1. Name (Column A) Contains the FontAwesome icon name (e.g., address-book).

2. Language (Column D) The target language code for translation (respecting Google Translate requirements).
Examples:

ar, bn, cs, da, de, el, en, es, fi, fr, hi, hu, id, it, iw, ja, ko, nl, no, pl, pt, ro, ru, sv, th, tr, uk, vi, zh-CN, zh-TW

3. Translation (Column E) Translate the English name to the target language.

=GOOGLETRANSLATE(A2, "en", D2)

4. Key Words (Column F) This is the magic part! I use Gemini to generate synonyms in the target language to facilitate the search.

=GEMINI("Find maximum 5 synonyms to facilitate search. This is an icon name. The goal is to allow users to find this icon using these keywords. Separate the answers with ', ' and strictly include the original name. Respond in the received language. You will receive: Language and keyword", D2:E2)

5. Icon Visual (Optional) Just for visual reference in the spreadsheet.

=IMAGE(CONCATENATE("https://raw.githubusercontent.com/FortAwesome/Font-Awesome/master/svgs/solid/", A2, ".svg"))

Why this approach?

Standard searches often rely on exact matches against the technical filename. If an icon is named bars, a user searching for “menu” or “navigation” won’t find it.

By using Gemini, we generate a semantic tag list (synonyms) for each icon. The FILTER expression then searches within these expanded keywords. This allows users to search using natural language and concepts rather than technical terms, significantly improving the UX.

AppSheet Configuration

To use this in your app, you can use the following expression in the Suggested Values of your Enum or selection column:

FILTER("ICONS", CONTAINS([Key words], [_THISROW].[Input]))

Note: Ensure the Key words column is defined as Text or Long Text and Name as Key in your Data structure.