Cannot change default font in .NET MAUI Blazor?

Question

It seems that it is impossible to include the downloaded font (e.g. any from Google) via CSS in a MAUI Blazer project!

I refer to the following post: How to change default font in .NET MAUI Blazor project?

I wrote this in the post there, but I was told to open a new post.

I have written about this in detail in the following post: https://learn.microsoft.com/en-us/answers/questions/1193613/change-font-in-maui-blazor

There is also a project on GitHub with which you can reproduce the problem: https://github.com/true-perfect-code/MauiApp1_LocalFont

Is it possible that something has changed in MAUI or WebView2 in the meantime?

I would be very grateful if someone could confirm my problem.

Thanks

Answer 1

In your sample project, you have the URL incorrectly set for the font (and a double @ symbol for some reason)

What you currently have in index.html

@@font-face {
  font-family: "Comfortaa Light";
  src: url("../css/open-iconic/font/fonts/Comfortaa.ttf") format("truetype");
}

What you should have (one @ for font-face and one . at the start of src):

@font-face {
  font-family: "Comfortaa Light";
  src: url("./css/open-iconic/font/fonts/Comfortaa.ttf") format("truetype");
}

Looks like this when those changes are made: