Do not input private or sensitive data. View Qlik Privacy & Cookie Policy.
Skip to main content

Announcements
Solving the Informatica Dilemma: On-Demand Briefing - Watch On Demand!
cancel
Showing results for 
Search instead for 
Did you mean: 
AnujKheria
Contributor III
Contributor III

Changing color of variable input chart in Qlik Cloud

Hello Experts,

I am looking  to change the color of variable input box in qlik cloud can some one help me with this, is there a way to apply custom backgroud color to it in my qlik cloud application.

Thanks

Labels (3)
1 Solution

Accepted Solutions
Daniel_Pilla
Employee
Employee

The variable input extension object now supports custom background colors OOTB under Presentation -> Styling. If you are looking to change the color/border of the input box itself, you can use CSS to achieve this:

.qv-object-qlik-variable-input .lui-input {
	background-color: #000000 !important;
	border: 1px solid #1b1b1b !important;
}

This can be applied in a custom theme or inside of a Multi KPI object which has the ability to add custom CSS. I have seen people use this object to directly effect the CSS on a single sheet and then hiding the Multi KPI object itself with, potentially layered inside of a layout container so it takes up zero space on the grid:

.qv-object-qlik-multi-kpi {
    display: none !important;
}

Do note that none of this is supported. I would suggest posting to ideation for more OOTB customization of this object if that is what you are seeking.

 

I hope this helps!

View solution in original post

4 Replies
David_Friend
Support
Support

can you share a screenshot to illustrate?

Daniel_Pilla
Employee
Employee

The variable input extension object now supports custom background colors OOTB under Presentation -> Styling. If you are looking to change the color/border of the input box itself, you can use CSS to achieve this:

.qv-object-qlik-variable-input .lui-input {
	background-color: #000000 !important;
	border: 1px solid #1b1b1b !important;
}

This can be applied in a custom theme or inside of a Multi KPI object which has the ability to add custom CSS. I have seen people use this object to directly effect the CSS on a single sheet and then hiding the Multi KPI object itself with, potentially layered inside of a layout container so it takes up zero space on the grid:

.qv-object-qlik-multi-kpi {
    display: none !important;
}

Do note that none of this is supported. I would suggest posting to ideation for more OOTB customization of this object if that is what you are seeking.

 

I hope this helps!

AnujKheria
Contributor III
Contributor III
Author

Hello Daniel, yes, this worked! Thanks for the solution. I used the Multi KPI and hid it, just as you suggested. Now, all the button colors have changed. My final question is: how can I select a specific object by its ID to change only its color?

ambers
Contributor
Contributor

Hooray! I finally managed to get the variable input boxes to look like this. Not with the .lui-input but with .lui-active

ambers_0-1749134638913.png