Font Awesome 5 Picker In Pure JavaScript – FontAwesome-Selector

Category: Javascript | March 14, 2019
Views Total:4,615 views
Official Page:Go to website
Last Update:March 14, 2019


Font Awesome 5 Picker In Pure JavaScript – FontAwesome-Selector


A simple, themeable Font Awesome selector that enables the visitor to quickly pick a Font Awesome 5 icon from the popup.

Supports Solid, Regular, and Brands icon types.

How to use it:

Load the latest Font Awesome iconic font in the html file.

<link rel="stylesheet" href="" integrity="sha384-fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr" crossorigin="anonymous">

Load the FontAwesome-Selector’s JavaScript and CSS files.

<link rel="stylesheet" href="/path/to/faSelectorStyle.min.css">
<script src="/path/to/faSelectorWidget.min.js"></script>

Add the fa-selector ID to the trigger element.

<span id="fa-selector">Icon Picker</span>

Make the trigger element to open the Font Awesome picker when clicked.

<span onclick="openFaSelector(this,event)" id="fa-selector">Icon Picker</span>

Change the theme (defaults to Classic) to Modern.

<span onclick="openFaSelector(this,event)" id="fa-selector" data-theme="modern">Icon Picker</span>

You Might Be Interested In:

Leave a Reply