Tachyons Typography Avenir Nex
In this article, we will learn how to style text in Avenir Nex using the Tachyons toolkit. Tachyons toolkit is free and open-source that is used to create a responsive website. Avenir Nex is a font style that is used to style the text.
Syntax:
<element-name class="avenir nex">...</element-name>
Used Classes:
- avenir nex class: This class is used to style text in Avenir Nex.
Example 1:
HTML
<!DOCTYPE html> < html > < head > < link rel = "stylesheet" href = </ head > < body > < center > < h1 class = "green" > GeeksforGeeks </ h1 > < h3 class = "avenir nex" > A COMPUTER SCIENCE PORTAL FOR GEEKS </ h3 > </ center > </ body > </ html > |
Output:

Example 2:
HTML
<!DOCTYPE html> < html > < head > < link rel = "stylesheet" href = </ head > < body > < center > < h1 class = "green" > GeeksforGeeks </ h1 > < h3 class = "avenir nex" > A COMPUTER SCIENCE PORTAL FOR GEEKS </ h3 > < button class = "avenir nex" > GeeksforGeeks </ button > < button class = "avenir nex" >About</ button > < button class = "avenir nex" >Practice</ button > < button class = "avenir nex" >DSA</ button > </ center > </ body > </ html > |
Output:

Reference: https://tachyons.io/docs/typography/font-family/avenir/
Please Login to comment...