Forum Discussion
Filter Pane Dropdown Text
I have updated the theme for my filter pane to have a font color of white. It looks great until you try to select something within the filter, such as Name contains, then the text is black.
Filter pane:
Dropdown:
As you can see, the text is barely visible. Below is the JSON for the filter theme:
"outspacePane": [{
"backgroundColor": {
"solid": {
"color": "#102E50"
}
},
"foregroundColor": {
"solid": {
"color": "#FFFFFF"
}
},
"transparency": 0,
"border": true,
"borderColor": {
"solid": {
"color": "#6f8196"
}
},
"checkboxAndApplyColor": {
"solid": {
"color": "#EC7014"
}
}
}
],
"filterCard": [{
"$id": "Applied",
"transparency": 0,
"foregroundColor": {
"solid": {
"color": "#FFFFFF"
}
},
"backgroundColor": {
"solid": {
"color": "#3f5772"
}
},
"inputBoxColor": {
"solid": {
"color": "#3f5772"
}
},
"borderColor": {
"solid": {
"color": "#6f8196"
}
},
"border": true
}, {
"$id": "Available",
"transparency": 0,
"foregroundColor": {
"solid": {
"color": "#FFFFFF"
}
},
"backgroundColor": {
"solid": {
"color": "#102E50"
}
},
"inputBoxColor": {
"solid": {
"color": "#102E50"
}
},
"borderColor": {
"solid": {
"color": "#6f8196"
}
},
"border": true
}
]
Is this a known issue for the newest version? I am using Version: 2.116.843.0 64-bit (April 2023).
Thank you,
Sara
I ended up using a different color scheme. Thank you!
5 Replies
- HarishKMSuper User
swjagodzinski Hello Sara,
Kindly change your background color from #102E50 to #E6E6E6.
Where ever you have used this #102E50 over there you have to use #E6E6E6.
Thanks
Harish M - amitchandakSuper User
swjagodzinski , Please check the meaning of level here, if that can help in setup
Use report themes in Power BI Desktop - Power BI | Microsoft Learn
- swjagodzinskiFrequent Visitor
Unfortunately, this did not help me. I'm not exactly sure what to do with the levels. I have added my entire JSON.
{ "name": "Name", "dataColors": ["#1D84B5", "#9ED9EF", "#D2F2FC", "#EC7014", "#F9B180", "#F9D9AF", "#449773", "#69BB97", "#9BD2BA", "#505151", "#C7CCCD", "#DEE7E7"], "foreground": "#FFFFFF", "foregroundNeutralSecondary": "#D2D0CE", "foregroundNeutralTertiary": "#6f8196", "background": "#102E50", "backgroundLight": "#274261", "backgroundNeutral": "#3f5772", "tableAccent": "#2878BD", "maximum": "#2878BD", "center": "#FCB714", "minimum": "#D0E4F5", "hyperlink": "#FFFFFF", "visitedHyperlink": "#D0E4F5", "visualStyles": { "*": { "*": { "background": [{ "color": { "solid": { "color": "#102E50" } } } ], "visualHeader": [{ "foreground": { "solid": { "color": "#FFFFFF" } }, "border": { "solid": { "color": "#102E50" } }, "background": { "solid": { "color": "#102E50" } } } ], "visualTooltip": [{ "titleFontColor": { "solid": { "color": "#FFFFFF" } }, "valueFontColor": { "solid": { "color": "#FFFFFF" } }, "background": { "solid": { "color": "#102E50" } } } ], "outspacePane": [{ "backgroundColor": { "solid": { "color": "#102E50" } }, "foregroundColor": { "solid": { "color": "#FFFFFF" } }, "transparency": 0, "border": true, "borderColor": { "solid": { "color": "#6f8196" } }, "checkboxAndApplyColor": { "solid": { "color": "#EC7014" } } } ], "filterCard": [{ "$id": "Applied", "transparency": 0, "foregroundColor": { "solid": { "color": "#FFFFFF" } }, "backgroundColor": { "solid": { "color": "#3f5772" } }, "inputBoxColor": { "solid": { "color": "#3f5772" } }, "borderColor": { "solid": { "color": "#6f8196" } }, "border": true }, { "$id": "Available", "transparency": 0, "foregroundColor": { "solid": { "color": "#FFFFFF" } }, "backgroundColor": { "solid": { "color": "#102E50" } }, "inputBoxColor": { "solid": { "color": "#102E50" } }, "borderColor": { "solid": { "color": "#6f8196" } }, "border": true } ] } }, "slicer": { "*": { "items": [{ "background": { "solid": { "color": "#274261" } }, "backgroundColor": { "solid": { "color": "#274261" } } } ], "numericInputStyle": [{ "background": { "solid": { "color": "#274261" } } } ], "date": [ { "background": { "solid": { "color": "#274261" } } } ], "selected": [{ "checkbox": { "color": "#EC7014" } } ], "header": [{ "background": { "solid": { "color": "#274261" } } } ], "background": [{ "color": { "solid": { "color": "#274261" } } } ] } }, "keyDriversVisual": { "*": { "keyInfluencersVisual": [{ "canvasColor": { "solid": { "color": "#274261" } } } ] } }, "card": { "*": { "background": [{ "color": { "solid": { "color": "#274261" } } } ] } }, "multiRowCard": { "*": { "background": [{ "color": { "solid": { "color": "#274261" } } } ] } }, "page": { "*": { "outspace": [{ "color": { "solid": { "color": "#102E50" } } } ], "background": [{ "transparency": 0 } ] } } }, "textClasses": { "callout": { "fontFace": "Object Sans", "color": "#FFFFFF" }, "title": { "fontFace": "Object Sans", "color": "#FFFFFF" }, "header": { "fontFace": "Object Sans", "color": "#FFFFFF" }, "label": { "fontFace": "Object Sans", "color": "#FFFFFF" }, "smallLightLabel": { "fontFace": "Object Sans", "color": "#FFFFFF" }, "lightLabel": { "fontFace": "Object Sans", "color": "#FFFFFF" }, "largeLightLabel": { "fontFace": "Object Sans", "color": "#FFFFFF" }, "boldLabel": { "fontFace": "Object Sans", "color": "#FFFFFF" }, "smallLabel": { "fontFace": "Object Sans", "color": "#FFFFFF" }, "largeLabel": { "fontFace": "Object Sans", "color": "#FFFFFF" }, "semiboldLabel": { "fontFace": "Object Sans", "color": "#FFFFFF" }, "largeTitle": { "fontFace": "Object Sans", "color": "#FFFFFF" } } }Is it possible to change the black font color in this dropdown to white?
- tobiasdirksenFrequent Visitor
Did you figure this out?
- swjagodzinskiFrequent Visitor
I ended up using a different color scheme. Thank you!