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

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.

This GIF shows the font changes in XWiki.