Fonts should be loaded from WFP’s Content Delivery Network:

<link rel="stylesheet" href="http://cdn.wfp.org/libraries/webfonts/lato/lato.css">
<link rel="stylesheet" href="http://cdn.wfp.org/libraries/webfonts/aleo/aleo.css">

Once the fonts are loaded, you can use them in your CSS:

Sans-serif

body {
  font-family: "lato", sans-serif;
}

Slab-serif

body {
  font-family: "aleo", sans-serif;
}

Our webfonts are also available for offline use, and come bundled with WFP UI, which you can download from GitHub. You can reference them from dist directory.