Howto

Usage

Copy css snippets to your HTML code, set font-family, font-weight and font-style accordingly.

Creation

Download sources from Ubuntu, unzip and create WOFF2 files using find ./ -name "*.ttf" -exec woff2_compress {} \;

Ubuntu

Code

<link rel="stylesheet" href="https://cdn.toometa.de/ubuntu-font-family/0.83/ubuntu.css" integrity="sha384-AoBN/Vdh6AQ1oqMuEIDyOGtHoJErAKn1nLLp2qyMMWdd5WqqkbqULbt/Gt10F50T" crossorigin="anonymous">

Normal

100

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.

300

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.

400

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.

500

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.

700

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.

Italic

300

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.

400

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.

500

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.

700

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.

Ubuntu Mono

Code

<link rel="stylesheet" href="https://cdn.toometa.de/ubuntu-font-family/0.83/ubuntu-mono.css" integrity="sha384-6MDLZJrdy4SKOByErfCqg8J6oPXAHeDbhs4P7KT/VQW9T42z4je39CoDeN6s9XGH" crossorigin="anonymous">

Normal

400

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.

700

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.

Italic

400

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.

700

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.

Ubuntu Condensed

Code

<link rel="stylesheet" href="https://cdn.toometa.de/ubuntu-font-family/0.83/ubuntu-condensed.css" integrity="sha384-LjhIXjFw/ZfjkNx2fLSyPOmyCWNXbGIx7bPmDxyYk8BbrGLi01/oxMvWZnkjjcnw" crossorigin="anonymous">

Normal

400

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.