Theming - Usage of the "Segoe (Bold)" font

[Anonymous]

Hello all..

I am tryiing to use the "Segoe Bold" font in a theme JSON file.  But the result is always Segoe UI, not bold.  I was thinking that maybe the parentheses in the font name cannot be understood in the JSON.  Has anybody been able to make Segoe (Bold) work in a theme file?

Here's an example of what I am trying:

        "header": [
          {
            "show": true,
            "fontFamily": "Segoe (Bold)",
            "fontColor": {
              "solid": {
                "color": "#415566"
              }
            },
            "textSize": 8
          }
        ]

[Anonymous]

Hello!

I know this is an old post, but I found the description for Segoe (Bold) in JSON.

"fontFamily": "wf_segoe-ui_bold"

And it works perfectly.

Disclaimer: I saw the description on a Ruth Pozuelo video from Curbal

[Seth_C_Bauer]

@Anonymous The below syntax worked for me. Alternatively, this is the output for just choosing the properties from the theme generator in powerbi.tips (check it out if you aren't familiar) -> https://powerbi.tips/tools/report-theme-generator-v3/ It allows you to choose the properties you want and automatically downloads the JSON file for you.

{
  "name": "My Theme",
  "visualStyles": {
    "*": { "*": { "*": [ { "color": { "solid": {} } } ] } },
    "tableEx": {
      "*": {
        "columnHeaders": [
          {
            "fontColor": { "solid": { "color": "#123456" } },
            "fontFamily": "Segoe (Bold)",
            "fontSize": 24
          }
        ]
      }
    }
  }
}

[Anonymous]

Hi Seth,

Thanks for the reply.  I'm aware of the Power BI theme generator.  I also found these useful: Template Theme Files for Power BI Visuals. 

I should have been more specific in my post... If you specify "Segoe (Bold)" as your font in the JSON, it does add it but it has no effect because apparently it doesn't match with what Power BI Desktop understands as "Segoe (Bold)".  If you look in the screenshot, you'll see the "Segoe (Bold)" at the bottom of the list is a duplicate with the one that actually works.  

If you put any invalid font name in there, it just adds it to the bottom of the list and it does nothing.  Segoe (Bold) is the only valid font name that has this problem.  That's why I was thinking it is an issue with the parentheses in the name.  But I couldn't find any info on if/how parentheses need to be escaped in JSON. 

[Seth_C_Bauer]

Gotcha, after some quick checking around we can remove the weight from the name and make it a seperate element. This code produces the expected result.

{
  "name": "My Theme",
  "visualStyles": {
    "*": { "*": { "*": [ { "color": { "solid": {} } } ] } },
    "tableEx": {
      "*": {
        "columnHeaders": [
          {
            "fontColor": { "solid": { "color": "#123456" } },
            "fontFamily": "Segoe",
            "fontWeight": "Bold",
            "fontSize": 24
          }
        ]
      }
    }
  }
}

[ballanda]

When I try this, it comes out looking like times new roman.  bummer

[ballanda]

Here's the values that work in fontFamily for the Segoe UI family...

- Segoe UI Light

- Segoe UI Regular

- Segoe UI Semibold

- Segoe UI Black

These values aren't recognized and produce a Times New Roman font, which is cool if you have a time machine that goes to 1994...

- Segoe UI Light Italic

- Segoe UI Semilight

- Segoe UI Semilight Italic

- Segoe UI Italic

- Segoe UI Bold

- Segoe UI Black Italic

- Segoe UI Bold Italic

The fontWeight property doesn't work at all, and it isn't mentioned here: https://docs.microsoft.com/en-us/power-bi/desktop-report-themes

I gan get by with Segoe UI Semibold and Segoe UI Black in my theme JSON.  So all good.  

</thread>

[Seth_C_Bauer]

@ballanda huh. Must have botched my own test. You are correct, the above does not work. However, I'm going to take another stab here 🙂 

I did find this ->https://github.com/Microsoft/powerbi-visuals-heatmap/blob/master/capabilities.json and digging into that code had an example of Segoe UI Bold. Can't say I understand the string, or reasoning but it appears to work.

{
  "name": "My Theme",
  "visualStyles": {
    "*": { "*": { "*": [ { "color": { "solid": {} } } ] } },
    "tableEx": {
      "*": {
        "columnHeaders": [
          {
            "fontColor": { "solid": { "color": "#123456" } },
            "fontFamily": "'Segoe UI Bold', wf_segoe-ui_bold, helvetica, arial, sans-serif",
            "fontSize": 24
          }
        ]
      }
    }
  }
}

[VictorMolenaar]

@Seth_C_Bauer This solution is working for me aswell, thanks a lot!!