
Remember that you can customize each Heading size, so you could keep H6 in reserve for the Elegant Icon Font and pull it out when needed. As long as the Design tab has the Elegant Icon Font set, you can feel free to use either the keyboard or unicode characters listed below to display the font you’d like. Once you have uploaded the font to your site, you can set the font to any heading or text style that you want. If you don’t want to go through the builder, you can always follow our tutorial to add them to your site another way. Because it is an actual font, the characters correspond to various keyboard buttons, which is why the name of the font that was entered as Elegant Icon Font is made up of various icons in the builder window.Īnd with that, your new Elegant Icon font is uploaded. You will see the font in the Design tab now.

ZIP file we linked to above, and unzip it on your computer. Uploading the Elegant Icon Font into the Divi Builderįirst of all, download the. If you’re not a Divi user, we have a tutorial on how to use any font you want on your website without a plugin that will get your site all set up. Then you can choose the icons from within most Divi modules’ Design tab, or you can use the unicode in your text to insert it the same way you would an ampersand or blank space. First, though, will need to upload one of the font files from the download link above into the Divi Builder. Using the Elegant Icon Font on your site is easy, especially if you’re an Elegant Themes member. How to Use the Elegant Icon Font on Your Website Combined with HTML elements, these icons can even turn into beautiful buttons like the download link above!

Using a single font and CSS, you can create countless graphical variations that would normally require the use of an equally countless collection of bulky and non-scalable images.

Icon fonts are great because they are flexible and fast loading.
