# Increase font size of element names in the builder

**URL:** <https://forum.bricksbuilder.io/t/increase-font-size-of-element-names-in-the-builder/2983>\
**Category:** How To\
**Created:** [May 11, 2022, 9:32pm UTC](https://forum.bricksbuilder.io/t/increase-font-size-of-element-names-in-the-builder/2983 "2022-05-11T21:32:26Z")\
**Posts on this page:** 9\
**Page:** 1

<div class="post-metadata">

**Author:** ![Nora](https://forum.bricksbuilder.io/user_avatar/forum.bricksbuilder.io/nora/32/16473_2.png) [@Nora](https://forum.bricksbuilder.io/u/Nora)\
**Post date:** [May 11, 2022, 9:32pm UTC](https://forum.bricksbuilder.io/t/increase-font-size-of-element-names-in-the-builder/2983/1 "2022-05-11T21:32:26Z")

</div>

We now have the ability to change the colors In the builder, thank you, it is easier for me to read. Would like to increase the font size so the elements are easier to read.

---

<div class="post-metadata">

**Author:** ![Sridhar](https://forum.bricksbuilder.io/user_avatar/forum.bricksbuilder.io/sridhar/32/22855_2.png) [@Sridhar](https://forum.bricksbuilder.io/u/Sridhar)\
**Post date:** [May 12, 2022, 12:15am UTC](https://forum.bricksbuilder.io/t/increase-font-size-of-element-names-in-the-builder/2983/2 "2022-05-12T00:15:17Z")

</div>

You can add the following sample CSS in Builder tab of Bricks’ settings to increase the font-size of some interface elements’ text, increase the opacity of placeholder text for better readability etc.:

```auto
[data-builder-mode=custom] {
    --builder-placeholder-opacity: .75;
    --builder-color-description: #ddd;
}

#bricks-panel-elements-categories .category-title {
    font-size: 16px;
    letter-spacing: 1px;
}

#bricks-panel-search {
    font-size: 16px !important;
}

.bricks-add-element .element-label,
.bricks-structure-list input[type="text"],
#panel-element-classes .bricks-control-popup ul li .name,
.bricks-panel,
.bricks-panel-controls .control-group-title,
.bricks-panel-controls .control .description {
    font-size: 15px;
}

#panel-element-classes .active-class input,
#panel-element-classes .active-class .symbol,
[data-balloon]:after {
    font-size: 14px;
}

[data-control=editor] .wp-editor-tools button {
    font-size: 13px;
}

```

---

<div class="post-metadata">

**Author:** ![royby](https://forum.bricksbuilder.io/user_avatar/forum.bricksbuilder.io/royby/32/887_2.png) [@royby](https://forum.bricksbuilder.io/u/royby)\
**Post date:** [May 13, 2022, 5:05am UTC](https://forum.bricksbuilder.io/t/increase-font-size-of-element-names-in-the-builder/2983/4 "2022-05-13T05:05:30Z")

</div>

Hi Sridhar

I don’t see any place in the builder tab to add this code, bricks version 1.4 RC2

cheers - roy

---

<div class="post-metadata">

**Author:** ![Michael](https://forum.bricksbuilder.io/user_avatar/forum.bricksbuilder.io/michael/32/101_2.png) [@Michael](https://forum.bricksbuilder.io/u/Michael)\
**Post date:** [May 13, 2022, 7:39am UTC](https://forum.bricksbuilder.io/t/increase-font-size-of-element-names-in-the-builder/2983/5 "2022-05-13T07:39:58Z")

</div>

Hi @royby

It’s hidden by default, you need to set it to custom first. Please see image below

 ![Screenshot_52](https://forum.bricksbuilder.io/uploads/default/original/2X/6/6d52308840c0e2a7f9452c6a30e4736ce1e126be.jpeg)

---

<div class="post-metadata">

**Author:** ![HeroRox](https://forum.bricksbuilder.io/letter_avatar_proxy/v4/letter/h/8baadc/32.png) [@HeroRox](https://forum.bricksbuilder.io/u/HeroRox)\
**Post date:** [May 13, 2022, 8:19am UTC](https://forum.bricksbuilder.io/t/increase-font-size-of-element-names-in-the-builder/2983/6 "2022-05-13T08:19:51Z")

</div>

Hi @royby, you can also find a helpful entry in the Bricks Academy:

> **[Builder Mode (Custom)](https://academy.bricksbuilder.io/article/builder-mode/)**
>
> Starting at Bricks 1.3.7 you can customize the builder mode (color scheme) to your liking by tweaking a few CSS variables. You first have to set the “Builder Mode” under “Bricks \> Settings \> Builder” to “Custom”. Then save your \[…\]

---

<div class="post-metadata">

**Author:** ![royby](https://forum.bricksbuilder.io/user_avatar/forum.bricksbuilder.io/royby/32/887_2.png) [@royby](https://forum.bricksbuilder.io/u/royby)\
**Post date:** [May 13, 2022, 8:25am UTC](https://forum.bricksbuilder.io/t/increase-font-size-of-element-names-in-the-builder/2983/7 "2022-05-13T08:25:07Z")

</div>

Thanks Michael, I had no idea this function existed. Cheers 😊

---

<div class="post-metadata">

**Author:** ![royby](https://forum.bricksbuilder.io/user_avatar/forum.bricksbuilder.io/royby/32/887_2.png) [@royby](https://forum.bricksbuilder.io/u/royby)\
**Post date:** [May 13, 2022, 8:26am UTC](https://forum.bricksbuilder.io/t/increase-font-size-of-element-names-in-the-builder/2983/8 "2022-05-13T08:26:45Z")

</div>

Thank you for your reply. Cheers

---

<div class="post-metadata">

**Author:** ![Nora](https://forum.bricksbuilder.io/user_avatar/forum.bricksbuilder.io/nora/32/16473_2.png) [@Nora](https://forum.bricksbuilder.io/u/Nora)\
**Post date:** [May 18, 2022, 1:31am UTC](https://forum.bricksbuilder.io/t/increase-font-size-of-element-names-in-the-builder/2983/9 "2022-05-18T01:31:56Z")

</div>

Thank you @Sridhar, your code helped me create a much more usable (for me) UI/UX.

---

<div class="post-metadata">

**Author:** ![andxblink](https://forum.bricksbuilder.io/letter_avatar_proxy/v4/letter/a/7ab992/32.png) [@andxblink](https://forum.bricksbuilder.io/u/andxblink)\
**Post date:** [October 24, 2024, 12:32am UTC](https://forum.bricksbuilder.io/t/increase-font-size-of-element-names-in-the-builder/2983/10 "2024-10-24T00:32:27Z")

</div>

Would it be possible to set the UI font size per user?

I have one person who needs it bigger. I am not sure if the issue is eyesight or display resolution.