Skip to content
Related Articles

Related Articles

SVG font-variant Attribute
  • Last Updated : 06 Nov, 2020

The font-variant attribute indicates the variant in which the text or font is to be rendered.

Syntax:

font-variant = "variant"

Attribute Values:

  • default value: Normal value is the default value.
  • animatable value: Animation value is the animatable value.
  • other values: small-caps value is an example of other values.

We will use the font-variant attribute for setting the variation of the font.

Example 1: 



HTML




<!DOCTYPE html>
<html>
  
<body>
    <svg viewBox="0 0 250 30" 
        xmlns="http://www.w3.org/2000/svg">
          
        <text y="20" font-variant="Normal">
            GeeksforGeeks
        </text>
    </svg>
</body>
  
</html>

Output:

Example 2: 

HTML




<!DOCTYPE html>
<html>
  
<body>
    <svg viewBox="0 0 250 30" 
        xmlns="http://www.w3.org/2000/svg">
          
        <text x="10" y="20" font-variant="small-caps">
            GeeksforGeeks
        </text>
    </svg>
</body>
  
</html>

Output:

My Personal Notes arrow_drop_up
Recommended Articles
Page :