Szeretnél egyedi betűtípust becsempészni a design-ba, de nem tudod, hogyan tedd mindezt? A Google Fonts a te barátod. :) A következőkben ennek a használatáról fogok írni, hogy az elképzelés a gyakorlatban is megvalósulhasson. 

A Google Fonts egy nagyon hasznos kis honlap, melyen rengeteg betűtípus közül válaszhatunk, ráadásul nem csak a design-t színesíthetjük vele, hanem a Word-készletünket is akár. 

A honlap elérhetősége a következő: https://fonts.google.com

Ha rámész a honlapra, akkor láthatod, hogy rengeteg sok betűtípus közül lehet választani, a határ tényleg a csillagos ég. Igen ám, de hogyan lássuk mindezt viszont a honlapunkon?

Először is, ha kiválasztottad a neked tetsző betűtípust, akkor kattints a betűtípus nevnél található piros körben lévő + jelre. Ezzel kiválasztottad a betűtípust, és az ablak alján megjelenik egy kis sötétszürke sáv, melyre ez van írva: "1 Family Selected". Erre kattints rá, és látni fogod, hogy megnyílk egy ablak, amely az általad választott betűtípus tulajdonságait és szükséges kódjait tartalmazza. 

 /nagyobb méretért kattints a képre!/

Ahhoz, hogy a design-ban szépen megjelenjen, nem elég a szokásos "font-family" helyre beírni a betűtípus nevét, ahhoz előbb importálni is kell. Tehát, kattints a "@IMPORT"-ra, és ott meg fog jelenni ez:

<style>
@import url('https://fonts.googleapis.com/css?family=Bungee');
</style>

Ezt kell beillesztened a kódodba, mégpedig a legelejére (erre utal a <style>, ugyanis az egész kód is így kezdődik), csakhogy a betűtípus neve után lévő </style> már NEM kell, ugyanis ez lezárná a kódot! Tehát, a gyakorlatban ez valahogy így néz ki:

<style type="text/css">
@import url('https://fonts.googleapis.com/css?family=Bungee');
body {
    background: #E5E9EA;
    background-attachment: scroll !important;
    background-repeat: repeat;
    cursor: default;
    overflow: -moz-scrollbars-vertical;
    overflow-x: hidden;
}
.site {
    width: 900px;
}

Pirossal emeltem ki azt a részt, amit tehát be kell másolnod a kódba. Ezután pedig a jól megszokott módon illesztheted be a kódod kívánt részébe, attól függ, hogy a szélső módul címét akarod ilyen betűtípussal viszontlátni, vagy esetleg a dőlt betűket:

font-family: 'Bungee', cursive;

Egyébként az is fontos, hogy cursive, sans-serif, vagy serif kerül ide, de ehhez is segítséget nyújt a Google Fonts, szóval inkább nézz utána, mert máskülönben nem fogja kiadni a betűtípust.