Open In App

Tachyons Typography Avenir Nex

Improve
Improve
Like Article
Like
Save
Share
Report

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/



Last Updated : 20 Jun, 2022
Like Article
Save Article
Previous
Next
Share your thoughts in the comments
Similar Reads