Home › Forums › Space themes support forum › Themes icon list code? › Reply To: Themes icon list code?
May 13, 2022 at 11:50 am
#375536
Luke Nielsen
Keymaster
Hello,
Our icons are not font awesome’s icons, they cannot be inserted using classes. They are inserted only in specific places and only by CSS that uses Unicode.
Here is a list of the Unicode for our icons.
$icon-angle-down: \e900;
$icon-angle-left: \e901;
$icon-angle-right: \e902;
$icon-angle-up: \e903;
$icon-arrow-down: \e904;
$icon-arrow-left: \e905;
$icon-arrow-right: \e906;
$icon-arrow-up: \e907;
$icon-bars: \e908;
$icon-cross: \e909;
$icon-heart: \e90a;
$icon-loupe: \e90b;
$icon-user: \e90c;
$icon-phone: \e90e;
$icon-map-marker: \e90f;
$icon-reply: \e910;
$icon-edit: \e911;
$icon-comment: \e912;
$icon-ellipsis-h: \e913;
$icon-star: \e914;
$icon-star-full: \e916;
$icon-calendar: \e917;
$icon-check: \e919;
$icon-plus: \e91a;
$icon-minus: \e91b;
$icon-share: \e91c;
$icon-expand-arrows: \e91e;
$icon-angle-down-bold: \e921;
$icon-angle-left-bold: \e922;
$icon-angle-right-bold: \e923;
$icon-angle-up-bold: \e924;
$icon-arrow-down-left-thin: \e927;
$icon-arrow-down-right-thin: \e928;
$icon-quote: \e929;
$icon-info: \e930;
$icon-exclamation: \e931;
$icon-image: \e932;
$icon-play-button: \e933;
$icon-music: \e934;
$icon-link: \e935;
$icon-image-gallery: \e936;
$icon-cart: \e937;
$icon-video: \e938;
$icon-pause: \e939;
$icon-unmute: \e940;
$icon-mute: \e941;
$icon-external-link: \e942;
$icon-retweet: \e943;
$icon-discount-coupon: \e944;
$icon-product-list-icon-1: \e945;
$icon-product-list-icon-2: \e946;
$icon-product-list-icon-3: \e947;
$icon-product-list-icon-4: \e948;
$icon-bars-2: \e949;
$icon-bag: \e950;
$icon-compare: \e951;
$icon-cart-empty: \e952;
$icon-cart-check: \e953;
$icon-size-guide: \e90d;
$icon-product-list-icon-2-1: \e954;
$icon-filter: \e955;
$icon-filters-bar: \e956;
$icon-wishlist-empty: \e957;
$icon-tablet-sorting: \e958;
$icon-envelope-regular: \e959;
$icon-facebook-f-brands: \e960;
$icon-twitter-brands: \e961;
$icon-instagram-brands: \e962;
$icon-telegram-brands: \e963;
$icon-youtube-brands: \e964;
$icon-snapchat-ghost-brands: \e965;
$icon-whatsapp-brands: \e966;
$icon-pinterest-brands: \e967;
$icon-linkedin-in-brands: \e968;
$icon-behance-brands: \e969;
$icon-dribbble-brands: \e970;
$icon-vimeo-v-brands: \e971;
$icon-tumblr-brands: \e972;
$icon-soundcloud-brands: \e973;
$icon-github-brands: \e974;
$icon-flickr-brands: \e975;
$icon-spotify-brands: \e976;
$icon-vk-brands: \e977;
$icon-odnoklassniki-brands: \e978;
$icon-facebook-box: \e979;
$icon-view: \e980;
$icon-home: \e981;
$icon-shop: \e982;
$icon-blog: \e983;
$icon-my-ac-account-details: \e984;
$icon-my-ac-addresses: \e985;
$icon-my-ac-downloads: \e986;
$icon-my-ac-log-out: \e987;
$icon-my-ac-setting: \e988;
$icon-my-ac-orders: \e989;
$icon-my-ac-wishlist: \e990;
$icon-tiktok-brands: \e991;
$icon-viber-brands: \e992;
Also, to be able to appear it, you should use font-family: font-icon;
Kind Regards