Skip to main content
cancel
Showing results for 
Search instead for 
Did you mean: 

Register now to learn Fabric in free live sessions led by the best Microsoft experts. From Apr 16 to May 9, in English and Spanish.

Reply
AlB
Super User
Super User

JSON file to set font size to a specific value (for all visuals)

Hi there,

 

I find the default themes come with font sizes too small. I would like to have them larger by default.

I don't know anything about JSON files but reading a bit and looking at a couple of them I put together the following one based on the Twilight theme to set all fonts to size 14. It works quite well and it sets most fonts correctly  but it doesn't change all of them. For instance, I've seen that it doesn't change the font in the filter visual.

Can any of you advise on how to get this to change all font sizes, in all visuals?

 

Many thanks in advance

 

 

{
  "name": "FontSize14+Twilight",
  "dataColors":["#F17925","#004753","#CCAA14","#4B4C4E","#D82C20","#A3D0D4","#536F18","#46ABB0","#F49451","#336C75","#D6BB43","#6F7071","#E0564D","#B5D9DD","#758C46","#6BBCC0","#B55B1C","#00353E","#99800F","#38393B","#A22118","#7A9C9F","#3E5312","#358084","#793D13","#00242A","#66550A","#262627","#6C1610","#52686A","#2A380C","#235658"],
  "background":"#FFFFFF",
  "foreground":"#070f25",
  "tableAccent":"#0F1934",

  "visualStyles": {
    "*": {
      "*": {
        "*": [
          {
            "fontSize": 14
          }
        ]
      }
    }
  }
}

       

1 ACCEPTED SOLUTION

Hi @AlB

Please look at 

Global Level Template

Adjust titles, backgrounds, report page tooltips, wallpaper, and more for some or all visuals on a page or all pages.

{
	"name": "GlobalLevelTemplate",
	"visualStyles": {
        "*": {
            "*": {
                "title": [{
                    "show": true,
                    "fontColor": { "solid": { "color": "#cc6600" } },
                    "background": { "solid": { "color": "#333333" } },
                    "alignment": "center",
                    "fontSize": 12,
                    "fontFamily": "Verdana"
                }],
                "background": [{
                    "show": true,
                    "color": { "solid": { "color": "#002a5b" } },
                    "transparency": 25
                }],
                "lockAspect": [{
                    "show": true
                }],
                "border": [{
                    "show": true,
                    "color": { "solid": { "color": "#886b01" } }
                }],
                "visualTooltip": [{
                    "type": "Default"
                }],
                "stylePreset": [{
                    "name": "None"
                }]
            }
        },
        "page": {
            "*": {
                "background": [{
                    "color": { "solid": { "color": "#465d85" } },
                    "transparency": 50
                }],
                "outspace": [{
                    "color": { "solid": { "color": "#886b01" } },
                    "transparency": 50
                }]
            }
        }
    }
}

Best Regards

Maggie

View solution in original post

3 REPLIES 3
v-juanli-msft
Community Support
Community Support

Hi @AlB

I learn from github repository , with the following code, i can make the front size as 14 for slicer

3.png

{
  "name": "FontSize14+Twilight",
  "dataColors":["#F17925","#004753","#CCAA14","#4B4C4E","#D82C20","#A3D0D4","#536F18","#46ABB0","#F49451","#336C75","#D6BB43","#6F7071","#E0564D","#B5D9DD","#758C46","#6BBCC0","#B55B1C","#00353E","#99800F","#38393B","#A22118","#7A9C9F","#3E5312","#358084","#793D13","#00242A","#66550A","#262627","#6C1610","#52686A","#2A380C","#235658"],
  "background":"#FFFFFF",
  "foreground":"#070f25",
  "tableAccent":"#0F1934",

  "visualStyles": {
    "*": {
      "*": {
        "*":[
          {
            "fontSize": 14
          }
        ]
      }
    },
    "slicer":{
       "*":    {
				"general": [{
					"outlineColor": { "solid": { "color": "#444444"}},
					"outlineWeight": 1,
					"orientation": "vertical",
					"responsive": true
				}],
				"data": [{
					"mode": "Basic",
					"relativeRange": "",
					"relativePeriod": ""
				}],
				"selection": [{
					"selectAllCheckboxEnabled": false,
					"singleSelect": true
				}],
				"header": [{
					"show": true,
					"fontColor": { "solid": { "color": "#000000"}},
					"background": { "solid": { "color": ""}},
					"outline": "None",
					"textSize": 14,
					"fontFamily": "Segoe UI"
				}],
				"items": [{
					"fontColor": { "solid": { "color": "#000000"}},
					"background": { "solid": { "color": ""}},
					"outline": "None",
					"textSize": 14,
					"fontFamily": "Segoe UI"
				}]
		      }
		}
  }
}

 

 

 

Best Regards

Maggie

 

Hi @v-juanli-msft

Thanks a lot for your response and for pointing me to github repository, which looks very interesting.

The solution you propose means addressing the issue for the slicer. If there are other visuals that did not work with my initial code, we would have to do something like what you suggest one by one.  That is a possibility but, is there a way, a piece of code, that sets the font at 14 for each and every visual at once? So that we can forget about individual cases. That's what I was trying to do with the bit in red but it doesn't cover all cases.

Thank you

 

{
  "name": "FontSize14+Twilight",
  "dataColors":["#F17925","#004753","#CCAA14","#4B4C4E","#D82C20","#A3D0D4","#536F18","#46ABB0","#F49451","#336C75","#D6BB43","#6F7071","#E0564D","#B5D9DD","#758C46","#6BBCC0","#B55B1C","#00353E","#99800F","#38393B","#A22118","#7A9C9F","#3E5312","#358084","#793D13","#00242A","#66550A","#262627","#6C1610","#52686A","#2A380C","#235658"],
  "background":"#FFFFFF",
  "foreground":"#070f25",
  "tableAccent":"#0F1934",
  "visualStyles": {
    "*": {
      "*": {
        "*": [
          {
            "fontSize": 14
          }
        ]
      }
    }
  }
}

   

Hi @AlB

Please look at 

Global Level Template

Adjust titles, backgrounds, report page tooltips, wallpaper, and more for some or all visuals on a page or all pages.

{
	"name": "GlobalLevelTemplate",
	"visualStyles": {
        "*": {
            "*": {
                "title": [{
                    "show": true,
                    "fontColor": { "solid": { "color": "#cc6600" } },
                    "background": { "solid": { "color": "#333333" } },
                    "alignment": "center",
                    "fontSize": 12,
                    "fontFamily": "Verdana"
                }],
                "background": [{
                    "show": true,
                    "color": { "solid": { "color": "#002a5b" } },
                    "transparency": 25
                }],
                "lockAspect": [{
                    "show": true
                }],
                "border": [{
                    "show": true,
                    "color": { "solid": { "color": "#886b01" } }
                }],
                "visualTooltip": [{
                    "type": "Default"
                }],
                "stylePreset": [{
                    "name": "None"
                }]
            }
        },
        "page": {
            "*": {
                "background": [{
                    "color": { "solid": { "color": "#465d85" } },
                    "transparency": 50
                }],
                "outspace": [{
                    "color": { "solid": { "color": "#886b01" } },
                    "transparency": 50
                }]
            }
        }
    }
}

Best Regards

Maggie

Helpful resources

Announcements
Microsoft Fabric Learn Together

Microsoft Fabric Learn Together

Covering the world! 9:00-10:30 AM Sydney, 4:00-5:30 PM CET (Paris/Berlin), 7:00-8:30 PM Mexico City

PBI_APRIL_CAROUSEL1

Power BI Monthly Update - April 2024

Check out the April 2024 Power BI update to learn about new features.

April Fabric Community Update

Fabric Community Update - April 2024

Find out what's new and trending in the Fabric Community.