Search code examples
githubfont-awesomegithub-flavored-markdownreadme

FontAwesome on GitHub flavored markdown


I want to know the best way to represent FontAwesome icons on GitHub flavoured markdown. Currently What I do is I include the path for my compiler to find FontAwesome and Academ-icons.

link rel="stylesheet" href="https://cdn.rawgit.com/jpswalsh/academicons/master/css/academicons.min.css">
<link href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous">

Then write my desired Academicon as

<i class="ai ai-arxiv ai-5x"></i>
<i class="fa fa-medium fa-5x" aria-hidden="true">

Mind you this is a markdown file that I am editing. When viewing on MarkdownPad, my README renders with the icons, but when pushed to Git the icons don't show. Compiling with Pandoc to an HTML page still renders the icons. Can someone help me with this?


Solution

  • After a few months of initially posing this question, I found the answer. So apparently GitHub does not support CSS rendering for security purposes. Here is an answer to this question.

    I have verified this using custom CSS and trying to centrally render a logo on my README but it doesn't work either. Here is the README in question

    I am not exactly sure but READMEs on GitLab may still render custom CSS. I have used GitLab but the GitLab settings vary w.r.t. the org.