How to load font in CSS / Embed Webfonts in CSS / Base64

Sometimes you will need to make your website faster. One of methods (not optimal in all cases of course) is to add base64 content into CSS files. For example images and fonts.

This is normal font-face definition:

@font-face {
  font-family: 'FontName';
  font-style: normal;
  font-weight: 400;
  src: local('FontName-Regular'), 
       url('FontName-Regular.woff') 
       format('woff');
}

In command line change woff to base64 file:

base64 -i FontName.woff -o FontName.woff.b64

Then in CSS file change:

src: url(data:font/woff;base64,<content from file FontName.woff.b64>)

And tadam! It works!