Improve your Github Pages-Icons

less than 1 minute read

Published:

In this post, we talk about how to use icons (font awesome icons) to decorate your github pages.

In fact, when we fork the repository from academic pages, some icons are already used by the original pages, such as github, location, email etc. The original academicpages uses the following three icons on the left.

These icons are generated using the following snippet of code.

<i class="fa fa-github fa-fw">
<i class="fa fa-linkedin fa-fw">
<i class="fa fa-envelope-square fa-fw">

where fa-fw stands for fixed width and fa-github means the icon for github. These lines of code can be directly copied into html/md files of your github pages. Except for fa-fw, there are other customization options that can be applied to the icons. For example, icons of different sizes can be generated using fa-xs, fa-sm, fa-lg, fa-2x, fa-3x…, which stands for extra small, small, large, 2x larger, 3x larger respectively.

We are also able to spin the icons.

Reference: Font Awesome Examples