Cacher is the code snippet organizer for pro developers

// MYTHEME.info.yml: add this:

libraries:
  - themeName/fonts
  
  
// MYTHEME.libraries.yml: add this:

fonts:
  license:
    name: SIL Open Font License, 1.1
    url: http://scripts.sil.org/cms/scripts/page.php?site_id=nrsi&id=OFL
  css:
    theme:
      //fonts.googleapis.com/css?family=Oxygen:300: { type: external }
      

// SEVERAL FONTS -> libraries.yml, like this:

# ophelia added fonts
bodyfonts:
  license:
    name: SIL Open Font License, 1.1
    url: http://scripts.sil.org/cms/scripts/page.php?site_id=nrsi&id=OFL
  css:
    theme:
      //fonts.googleapis.com/css?family=Roboto+Condensed:300,400,700|Titillium+Web:300,400,700: { type: external }

displayfonts:
  license:
    name: SIL Open Font License, 1.1
    url: http://scripts.sil.org/cms/scripts/page.php?site_id=nrsi&id=OFL
  css:
    theme:
      //fonts.googleapis.com/css?family=Oxygen:300: { type: external }   



// drush cache rebuild!     
// Now you should be able to view source of your site and see comforting line of code:
<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Oxygen:300" media="all" />   

// All that remains is to implement the font in your CSS by inserting a rule in the myStyles.css file in the css folder, like:

font-family: 'Oxygen', sans-serif;