How To Minimize Page Weight While Using Font Awesome Icons #1

Like Font Awesome's icons, the relative sizing scale is created with modern browsers' default 16px font-size in mind and creates steps up/down from there.

You can also directly style an icon's size by setting a font-size in your project's CSS that targets an icon or directly in the style attribute of the HTML ...

Font Awesome icons are designed on grid and share a consistent height. But they vary in width depending on how wide or narrow each symbol is.

Size. Font Awesome supports t-shirt size scale from 2xs to 2xl as well as literal sizing from 1x to 10x . Remember, you can always control icon size directly ...

Size. Font Awesome supports t-shirt size scale from 2xs to 2xl as well as literal sizing from 1x to 10x . Remember, you can always control icon size directly ...

To increase icon sizes relative to their container, use the fa-lg (33% increase), fa-2x , fa-3x , fa-4x , or fa-5x classes. ... If your icons are getting chopped ...

I'm trying to increase the size of my Font Awesome icons on my mobile version of my portfolio: https://giacomolaw.github.io/mobile.html.

Font-Awesome icons can be sized by simply using font-size - it's a FONT, not graphics. Using the built-in classes just applies that via a class.

To increase icon sizes relative to their container, use the fa-lg (33% increase), fa-2x, fa-3x, fa-4x, or fa-5x classes.

In this screencast we'll guide you through the process of changing icon color and size. Whether you're a beginner or an experienced designer ...