Tumblr的Base64编码@ font-face

Question

Since Tumblr does not accept webfont files that are hosted on other domains, I am trying to import the files directly with Base64 encoding.

This is the format I have used:

@font-face {
  font-family: 'FontName';
  src: url(data:application/vnd.ms-fontobject;base64,[BASE64 CODE]);
  src: url(data:font/woff2;base64,[BASE64 CODE]) format('woff2'),
       url(data:application/font-woff;base64,[BASE64 CODE]) format('woff'),
       url(data:application/x-font-truetype;base64,[BASE64 CODE]) format('truetype');
}

I have tried pasting this with the appropriate code to the Tumblr CSS editor, HTML editor in a style tag and in a external stylesheet without any success. What am I doing wrong?

Answer 1

It seems that the Base64 encoder I was using produced code that did not work. For anyone encountering the same issue, try using this encoder: https://www.giftofspeed.com/base64-encoder/