Skip to content
Related Articles

Related Articles

Save Article
Improve Article
Save Article
Like Article

SVG font-weight Attribute

  • Last Updated : 03 Nov, 2020

The font-weight attribute refers to the boldness or lightness of the glyphs used to render the text, relative to other fonts in the same font family.

Syntax:

Attention reader! Don’t stop learning now. Get hold of all the important HTML concepts with the Web Design for Beginners | HTML  course.

font-variant="variation"

Attribute Values:

  • Default value: Default value is normal.
  • other value: Other values are bold, bolder, lighter.

We will use the font-weight attribute for setting the weight of font.



Example 1: 

HTML




<!DOCTYPE html>
<html>
  
<body>
    <svg viewBox="0 0 200 300" 
        xmlns="http://www.w3.org/2000/svg">
          
        <text x="5" y="20" 
            font-weight="Normal">
            Normal text
        </text>
    </svg>
</body>
  
</html>

Output:

Example 2: 

HTML




<!DOCTYPE html>
<html>
  
<body>
    <svg viewBox="0 0 200 300" 
        xmlns="http://www.w3.org/2000/svg">
          
        <text x="5" y="20" font-weight="bold">
            bold text
        </text>
    </svg>
</body>
  
</html>

Output:




My Personal Notes arrow_drop_up
Recommended Articles
Page :