# Add ability to edit text style and color for header

**URL:** <https://community.elfsight.com/t/add-ability-to-edit-text-style-and-color-for-header/165487>\
**Category:** Calculator\
**Tags:** Gathering-Feedback\
**Created:** [June 25, 2026, 10:40pm UTC](https://community.elfsight.com/t/add-ability-to-edit-text-style-and-color-for-header/165487 "2026-06-25T22:40:28Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![Dave\_Smith](https://sea2.discourse-cdn.com/flex020/user_avatar/community.elfsight.com/dave_smith/32/101132_2.png) [@Dave\_Smith](https://community.elfsight.com/u/Dave_Smith)\
**Post date:** [June 25, 2026, 10:40pm UTC](https://community.elfsight.com/t/add-ability-to-edit-text-style-and-color-for-header/165487/1 "2026-06-25T22:40:28Z")

</div>

The calculator is great, BUT I found that I was unable to edit the header’s text style or color.

---

<div class="post-metadata">

**Author:** ![Sina](https://sea2.discourse-cdn.com/flex020/user_avatar/community.elfsight.com/sina/32/59970_2.png) [@Sina](https://community.elfsight.com/u/Sina)\
**Post date:** [June 25, 2026, 11:04pm UTC](https://community.elfsight.com/t/add-ability-to-edit-text-style-and-color-for-header/165487/2 "2026-06-25T23:04:17Z")

</div>

Hi @Dave_Smith welcome to Community 👏

thats a great idea. I can recommend this code as a quick solution.  
Add this code to the Custom CSS field on the Settings tab of your [Calculator](https://elfsight.com/calculator-form-widget/) widget’s settings and adjust the values ​​to suit your desired styles.

```auto
[class*='header__Container-sc'] [class*='typography__Container-sc'] {
  font-family: Roboto !important;
  font-size: 28px !important;
  color: green; // set up here your favorite font color
}

```

---

<div class="post-metadata">

**Author:** ![Max](https://sea2.discourse-cdn.com/flex020/user_avatar/community.elfsight.com/max/32/710_2.png) [@Max](https://community.elfsight.com/u/Max)\
**Post date:** [June 26, 2026, 10:06am UTC](https://community.elfsight.com/t/add-ability-to-edit-text-style-and-color-for-header/165487/3 "2026-06-26T10:06:58Z")

</div>

Hi there, @Dave_Smith 👋

Thanks a lot for sharing your thoughts!

Sina shared a great solution, so feel free to use it in your widget. Although, it’s possible to apply a custom code, we agree that it would be awesome to have header style settings right in the configurator.

We’ll try to think it over in the future updates, especially if this idea gets more votes 🙂