# How to have a different font size inside the text field than the font size of its description with ControlP5?

**URL:** https://discourse.processing.org/t/how-to-have-a-different-font-size-inside-the-text-field-than-the-font-size-of-its-description-with-controlp5/28452
**Category:** Libraries
**Created:** [March 11, 2021, 9:19pm UTC](https://discourse.processing.org/t/how-to-have-a-different-font-size-inside-the-text-field-than-the-font-size-of-its-description-with-controlp5/28452 "2021-03-11T21:19:57Z")
**Posts on this page:** 4
**Page:** 1

<div class="post-metadata">

### Author: ![tea\_tree](https://avatars.discourse-cdn.com/v4/letter/t/d6d6ee/32.png) [@tea\_tree](https://discourse.processing.org/u/tea_tree)
#### Post date: [March 11, 2021, 9:19pm UTC](https://discourse.processing.org/t/how-to-have-a-different-font-size-inside-the-text-field-than-the-font-size-of-its-description-with-controlp5/28452/1 "2021-03-11T21:19:57Z")

</div>

I’d like to add a textfield named “input”. The description (“input”) should be of font size 5 but inside the text field I’d like to use a font size that fills out most of the text field. In any case, I’d like the font size for inside the text field to be bigger than 5.

This is how I’m coding the text field. How can I adjust the text sizes for the text field description and the text field input independently?

```auto

 cp5.addTextfield("input")
    .setPosition(20, 100)
    .setSize(200, 40)
    .setFont(createFont("ArialCE.ttf", 5, true))
    .setFocus(true)
    .setColor(color(255, 0, 0))
    ;

```

---

<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: [March 11, 2021, 9:22pm UTC](https://discourse.processing.org/t/how-to-have-a-different-font-size-inside-the-text-field-than-the-font-size-of-its-description-with-controlp5/28452/2 "2021-03-11T21:22:23Z")

</div>

Did you check the examples and stuff on the website please?

The controlp5 Website?

---

<div class="post-metadata">

### Author: ![tea\_tree](https://avatars.discourse-cdn.com/v4/letter/t/d6d6ee/32.png) [@tea\_tree](https://discourse.processing.org/u/tea_tree)
#### Post date: [March 11, 2021, 11:28pm UTC](https://discourse.processing.org/t/how-to-have-a-different-font-size-inside-the-text-field-than-the-font-size-of-its-description-with-controlp5/28452/3 "2021-03-11T23:28:20Z")

</div>

I couldn’t find anything in the documentation but I did find something here: [How to change the defauld settings of the label of a textfield using Controlp5 library - Processing 2.x and 3.x Forum](https://forum.processing.org/two/discussion/13149/how-to-change-the-defauld-settings-of-the-label-of-a-textfield-using-controlp5-library)

```auto
  cp5 = new ControlP5(this);
 
  PFont font = createFont("arial",20);
 
  Textfield t = cp5.addTextfield("textValue")
        .setPosition(120,170)
        .setSize(200,40)
        .setFont(font);
 
  Label label = t.getCaptionLabel(); 
  label.setFont(font);

```

---

<div class="post-metadata">

### Author: ![MiguelSanches](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/miguelsanches/32/11172_2.png) [@MiguelSanches](https://discourse.processing.org/u/MiguelSanches)
#### Post date: [March 12, 2021, 8:41am UTC](https://discourse.processing.org/t/how-to-have-a-different-font-size-inside-the-text-field-than-the-font-size-of-its-description-with-controlp5/28452/4 "2021-03-12T08:41:42Z")

</div>

Hi @tea_tree

It is possible if you call the right part of the controller  
Please find the code below for your case. Hope it helps 🙂

```auto
import controlP5.*;

ControlP5 cp5;

String textValue = "";

void setup() {
  size(700,400);
  
  PFont font = createFont("arial",20);
  PFont controlFont = createFont("arial", 5);
  
  cp5 = new ControlP5(this);
  
  cp5.addTextfield("input")
     .setPosition(20,100)
     .setSize(200,40)
     .setFont(font)
     .setFocus(true)
     .setColor(color(255,0,0))
     ;
  cp5.getController("input").getCaptionLabel().setFont(new ControlFont(controlFont)); //set the font of the caption label.
  //you can also use this same method to set the font for the textarea instead of using .setFont() in the definition of the controller object.
  //cp5.getController("input").getValueLabel().setFont(new ControlFont(font));
                 
}

void draw() {
  background(0);
  fill(255);
  text(cp5.get(Textfield.class,"input").getText(), 360,130);
  text(textValue, 360,180);
}

public void clear() {
  cp5.get(Textfield.class,"textValue").clear();
}

void controlEvent(ControlEvent theEvent) {
  if(theEvent.isAssignableFrom(Textfield.class)) {
    println("controlEvent: accessing a string from controller '"
            +theEvent.getName()+"': "
            +theEvent.getStringValue()
            );
  }
}

public void input(String theText) {
  // automatically receives results from controller input
  println("a textfield event for controller 'input' : "+theText);
}

```

Best regards