How to add a custom font for website globally?

It is possible to add 3-d party font for website like in this article: https://css-tricks.com/snippets/css/using-font-face/

Here is the list of necessary files:

webfont.eot
webfont.woff2
webfont.woff
webfont.ttf
webfont.svg

When you will mount all necessary files in fonts folder, please click WP Dashboard => Appearance => Customize => Additional CSS and paste this code here:

@font-face {
    font-family: 'DecimaProLight';
    src: url('http://www.cstclima.it/wp-content/themes/mytheme's_folder/fonts/DecimaProLight.eot');
    src: url('http://www.cstclima.it/wp-content/themes/mytheme's_folder/fonts/DecimaProLight.eot?#iefix') format('embedded-opentype'),
        url('http://www.cstclima.it/wp-content/themes/mytheme's_folder/fonts/DecimaProLight.woff2') format('woff2'),
        url('http://www.cstclima.it/wp-content/themes/mytheme's_folder/fonts/DecimaProLight.woff') format('woff'),
        url('http://www.cstclima.it/wp-content/themes/mytheme's_folder/fonts/DecimaProLight.ttf') format('truetype'),
        url('http://www.cstclima.it/wp-content/themes/mytheme's_folder/DecimaProLight.svg#DecimaProLight') format('svg');
    font-weight: 300;
    font-style: normal;
}
h1, h2, h3, h4, h5, h6 {
    font-family: 'DecimaProLight' !important;
}
body {
 font-family: 'DecimaProLight';
}

As you understand, please use instead of DecimaProLight the name of your custom font.

Save all changes and check results at the front-end.