About
boldness is a typographic effect that sets the font weight. It defines the width of a character outlines relative to its height.
Syntax
Double Star
With the double star, you can set quickly the font weight (boldness) to the value bold
Example:
- Input
This text is a **bold text**.
- Output:
This text is a bold text.
You cannot use this syntax with only space before it on a line because it will be seen as a list element.
Name or numerical Value
You can also set a precise value with the typographic attribute boldness that accepts a name or a numerical value.
The following names are supported and any numerical value.
| Name | Numerical values |
|---|---|
| Thin | 100 |
| Extra-light | 200 |
| Light | 300 |
| Normal | 400 |
| Medium | 500 |
| Semi-bold | 600 |
| Bold | 700 |
| Extra-bold | 800 |
| Black | 900 |
| Extra-black | 950 |
Example with the itext component
- Input
This text is a <itext boldness="black">black text</itext>
- Output:
This text is a black text
Superlatif (More or less than)
You can also set a superlatif that is set according to the boldness of the parent.
We accepts the following values:
- bolder: bolder than the parent
- lighter: lighter than the parent
Example with the text component
- Input
<text boldness="light">
This text is a <itext boldness="bolder">bolder text</itext>
</text>
- Output:
This text is a bolder text