Fix TTF Font Not Loading In IE11 – “CSS3114: @font-face failed OpenType embedding permission check. Permission must be Installable.”
June 16, 2020 by Andreas Wik
TL;DR: Turn your TTF font’s permission into installable with https://www.andrebacklund.com/fontfixer.html and use the new file instead.
Internet Explorer 11 can be a real pain in the neck to support. Today I will cover one of the problems it has with font files, more specifically TTF files.
When using a TTF font in your CSS like this…
@font-face {
font-family: 'AwikioSans';
src: url('AwikioSans.ttf') format('truetype');
}
h1 {
font-family: 'AwikioSans';
}
…you may be faced with the following error in the console: CSS3114: @font-face failed OpenType embedding permission check. Permission must be Installable.
To open the console in Internet Explorer, go to Tools –> Developer Tools and select Console in the list of tabs.
To fix this error, you need to change the permissions for the TTF file. There is a super easy tool created by Andre Backlund to do just this. I’ve used it myself and it resolved this error every single time. Go here and upload your file, then use the new downloaded TTF file instead.
Done!