How to use a custom font in XWiki?

Use remote fonts

For instance, Google Fonts:

1. Go into Browse Fonts - Google Fonts page
2. Select any desired font style (you can observe it in live editor)
3. Copy and save the name of the font temporarily (here, we'll use "Lumanosimo")
4. Go into CSS API - Google Fonts page
5. Modify the code below (replace "Lumanosimo" with the name of your desired font)
   <link rel="stylesheet"           href="https://fonts.googleapis.com/css2?family=Lumanosimo">     <style>       body {         font-family: 'Lumanosimo', serif;         font-size: 20px;       }     </style>
6. Next, apply to your XWiki: navigate to Administer Wiki → Look & Feel → Presentation → HTTP Meta Info. Place the above code into the end of the field (do not overwrite the existing lines).
7. Finally, go to Administer Wiki → Look & Feel → Themes → Customize, from Color Theme section → click on Typography and fill these 2 fields @font-family-base and @font-family-sans-serif with the name "Lumanosimo" observe the changes in the preview window (it'll refresh automatically)
8. Save changes

Upload locally custom FFT file

Using XWiki folder

We'll use the same Google Fonts "Lumanosimo":

1. Download this font or desired one from Browse Fonts - Google Fonts page
2. Unzip it in XWiki folder /webapps/xwiki/WEB-INF/fonts. After this, restart is mandatory
3. Repeat step #7 from the previous section and save the changes.

Using System folder

1. Unzip the downloaded font in OS system folder: for Windows users  C:\Windows\Fonts and for Linux users /usr/local/share/fonts After this, restarting the OS is mandatory. Instead of restarting, you can use Logout/Sing out option.
2. Repeat step #7 from the previous section and save the changes.

This GIF shows the font changes in XWiki.