# What are the fontStyle possible values?

**URL:** <https://phaser.discourse.group/t/what-are-the-fontstyle-possible-values/9626>\
**Category:** Phaser 3\
**Created:** [May 19, 2021, 10:02am UTC](https://phaser.discourse.group/t/what-are-the-fontstyle-possible-values/9626 "2021-05-19T10:02:52Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![TheGary](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/thegary/32/5191_2.png) [@TheGary](https://phaser.discourse.group/u/TheGary)\
**Post date:** [May 19, 2021, 10:02am UTC](https://phaser.discourse.group/t/what-are-the-fontstyle-possible-values/9626/1 "2021-05-19T10:02:52Z")

</div>

Hi,  
I was going through the docs about [text Game Objects](https://newdocs.phaser.io/docs/3.54.0/Phaser.GameObjects.Text) because I wanted to understand what are all the possible properties that can be passed to a text in order to style it.  
I see that something like `fontWeight` doesn’t exist, thus I understand that the properties are not all those that are available for styling text in CSS.

To make a fontWeight for example I could use `stroke` and `strokeThickness` but this way I would cut the opportunity to add an outline to the text.

[Here](https://newdocs.phaser.io/docs/3.54.0/Phaser.Types.GameObjects.Text.TextStyle) I found all the possible styles that can be passed to a text Game Object and I was curious about what fontStyle is, the description is terrible:

> Any addition font styles, such as ‘strong’.

What does this mean? `strong` in HTML is an element not a style, while the `font-style` property in CSS doesn’t allow `strong` as a possible value.

So I am very confused. Can anyone help please?  
[https://newdocs.phaser.io/docs/3.54.0/Phaser.GameObjects.TextStyle#fontStyle](https://newdocs.phaser.io/docs/3.54.0/Phaser.GameObjects.TextStyle#fontStyle)

---

<div class="post-metadata">

**Author:** ![Telinc1](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/telinc1/32/60_2.png) [@Telinc1](https://phaser.discourse.group/u/Telinc1)\
**Post date:** [May 19, 2021, 10:28am UTC](https://phaser.discourse.group/t/what-are-the-fontstyle-possible-values/9626/2 "2021-05-19T10:28:48Z")

</div>

The entire font style is the same format as the [`font` on a canvas](https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/font), which in turn uses the syntax of the CSS `font` property.

---

<div class="post-metadata">

**Author:** ![TheGary](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/thegary/32/5191_2.png) [@TheGary](https://phaser.discourse.group/u/TheGary)\
**Post date:** [May 19, 2021, 11:15am UTC](https://phaser.discourse.group/t/what-are-the-fontstyle-possible-values/9626/3 "2021-05-19T11:15:38Z")

</div>

Hi [Telinc1](https://phaser.discourse.group/u/Telinc1), thank you for your answer, I’m still a bit confused, so to recap: the property [fontStyle](https://newdocs.phaser.io/docs/3.54.0/Phaser.GameObjects.TextStyle#fontStyle) of the text Object in Phaser is the same as the [**`.font`** property of the Canvas 2D API](https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/font).  
The MDN page about it states:

> This string uses the same syntax as the [CSS font](https://developer.mozilla.org/en-US/docs/Web/CSS/font) specifier

and the CSS font is a shorthand rule for:

- `font-family`
- `font-size`
- `font-stretch`
- `font-style`
- `font-variant`
- `font-weight`
- `line-height`

Basically fontStyle in Phaser can represent all of these possible values?

---

<div class="post-metadata">

**Author:** ![Telinc1](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/telinc1/32/60_2.png) [@Telinc1](https://phaser.discourse.group/u/Telinc1)\
**Post date:** [May 19, 2021, 12:07pm UTC](https://phaser.discourse.group/t/what-are-the-fontstyle-possible-values/9626/4 "2021-05-19T12:07:26Z")

</div>

Sorry, I should have been clearer in my previous post. The overall font of a Text object is controlled by `fontStyle`, `fontSize`, and `fontFamily`. `fontStyle` can correspond to `font-style`, `font-variant`, or `font-weight` in CSS. You can set all properties at once with `setFont`, which uses the syntax of CSS’s `font`.

---

<div class="post-metadata">

**Author:** ![TheGary](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/thegary/32/5191_2.png) [@TheGary](https://phaser.discourse.group/u/TheGary)\
**Post date:** [May 19, 2021, 5:18pm UTC](https://phaser.discourse.group/t/what-are-the-fontstyle-possible-values/9626/5 "2021-05-19T17:18:48Z")

</div>

Thank you! I’m still new to Phaser and I need to learn more about it. Could you suggest any other resource than the official docs (which I find a tad spartan)?

---

<div class="post-metadata">

**Author:** ![Telinc1](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/telinc1/32/60_2.png) [@Telinc1](https://phaser.discourse.group/u/Telinc1)\
**Post date:** [May 19, 2021, 6:30pm UTC](https://phaser.discourse.group/t/what-are-the-fontstyle-possible-values/9626/6 "2021-05-19T18:30:56Z")

</div>

You can try [rexrainbow’s notes](https://rexrainbow.github.io/phaser3-rex-notes/docs/site/). They’re friendlier than the formal API docs.
