# How do I change the font that is used by a button in p5?

**URL:** <https://discourse.processing.org/t/how-do-i-change-the-font-that-is-used-by-a-button-in-p5/24887>\
**Category:** Coding Questions\
**Created:** [October 25, 2020, 6:27am UTC](https://discourse.processing.org/t/how-do-i-change-the-font-that-is-used-by-a-button-in-p5/24887 "2020-10-25T06:27:06Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![The\_Rogue12](https://avatars.discourse-cdn.com/v4/letter/t/22d042/32.png) [@The\_Rogue12](https://discourse.processing.org/u/The_Rogue12)\
**Post date:** [October 25, 2020, 6:27am UTC](https://discourse.processing.org/t/how-do-i-change-the-font-that-is-used-by-a-button-in-p5/24887/1 "2020-10-25T06:27:06Z")

</div>

I am not sure how I can do this. I have tried all the style() properties that I know, but none of them are able to change the font on a button. Example code I am trying to write:

```auto
let drawButton;
let circle = false;

function setup() {
  txt = loadFont('assets/font.ttf');
  createCanvas(800, 800);

  drawButton = createButton('Draw');
  drawButton.position(230, 650);
  drawButton.size(350, 100);
  drawButton.mousePressed(yes);
  drawButton.style('background-color', 'black');
  drawButton.style('font-size', '44px');
  drawButton.style('color', 'white');

  //this code doesn't work the way I want it to
  drawButton.style('font-type', txt);
}

function yes() {
  circle = true
}

function draw() {
  background(220);
  if (circle === true) {
    ellipse(400, 400, 100, 100);
  }
}

```

---

<div class="post-metadata">

**Author:** ![Chrisir](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/chrisir/32/45_2.png) [@Chrisir](https://discourse.processing.org/u/Chrisir)\
**Post date:** [October 26, 2020, 9:48am UTC](https://discourse.processing.org/t/how-do-i-change-the-font-that-is-used-by-a-button-in-p5/24887/2 "2020-10-26T09:48:04Z")

</div>

Is this p5 or css or…?

---

<div class="post-metadata">

**Author:** ![Chrisir](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/chrisir/32/45_2.png) [@Chrisir](https://discourse.processing.org/u/Chrisir)\
**Post date:** [October 26, 2020, 10:30am UTC](https://discourse.processing.org/t/how-do-i-change-the-font-that-is-used-by-a-button-in-p5/24887/3 "2020-10-26T10:30:50Z")

</div>

Maybe it’s drawButton.caption.style(…

---

<div class="post-metadata">

**Author:** ![The\_Rogue12](https://avatars.discourse-cdn.com/v4/letter/t/22d042/32.png) [@The\_Rogue12](https://discourse.processing.org/u/The_Rogue12)\
**Post date:** [October 26, 2020, 8:06pm UTC](https://discourse.processing.org/t/how-do-i-change-the-font-that-is-used-by-a-button-in-p5/24887/4 "2020-10-26T20:06:48Z")

</div>

I tried that and it didn’t work.

---

<div class="post-metadata">

**Author:** ![Chrisir](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/chrisir/32/45_2.png) [@Chrisir](https://discourse.processing.org/u/Chrisir)\
**Post date:** [October 26, 2020, 8:17pm UTC](https://discourse.processing.org/t/how-do-i-change-the-font-that-is-used-by-a-button-in-p5/24887/5 "2020-10-26T20:17:08Z")

</div>

You also haven’t answered my question

---

<div class="post-metadata">

**Author:** ![The\_Rogue12](https://avatars.discourse-cdn.com/v4/letter/t/22d042/32.png) [@The\_Rogue12](https://discourse.processing.org/u/The_Rogue12)\
**Post date:** [October 26, 2020, 9:01pm UTC](https://discourse.processing.org/t/how-do-i-change-the-font-that-is-used-by-a-button-in-p5/24887/6 "2020-10-26T21:01:54Z")

</div>

It is p5. It says so in the tag for this question.

---

<div class="post-metadata">

**Author:** ![Chrisir](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/chrisir/32/45_2.png) [@Chrisir](https://discourse.processing.org/u/Chrisir)\
**Post date:** [October 26, 2020, 11:24pm UTC](https://discourse.processing.org/t/how-do-i-change-the-font-that-is-used-by-a-button-in-p5/24887/7 "2020-10-26T23:24:15Z")

</div>

Maybe you look here

> **[CSS font-family property](https://www.w3schools.com/cssref/pr_font_font-family.asp)**