Qlik Community

QlikView Documents

Documents for QlikView related information.

Announcements
Announcement: Certain actions are currently causing a Page Not Found error. This is a known issue and we are working with the platform vendor to investigate and resolve it.

Qlik Simple Colour Tool

Partner
Partner

Qlik Simple Colour Tool

Hi all,

I wanted to share with you a QVW I've been using for a while now. First off, I'd like to mention that it is by no means my idea/concept, I've merely adapted (striped-down) Adam Booth's fine work from 2013 to fit my own needs. If you're looking for a more in-depth version of this application, I suggest you check out his original application,QlikView Colour Tool V1.qvw.

This application asks you to select a colour using the RGB input boxes which you can adjust using the sliders to display your selection, along with 4 similar colours (2 lighter and 2 darker). These colours are not just a few shades lighter but have subtle differences that help me when I'm building applications...especially the ones that contain Heat Maps!

I've also included the 2 main tips I use when naming my colour variables that makes my life a little easier, especially if a client decides to change their corporate colour scheme years after an application has been built!

Enjoy.

Update: Including closest ARGB value of Primary Colour (thanks to John Witherspoon‌)

Update Update: Changed script to John Witherspoon's idea. Bother versions of the tool now exist in the script so feel free to use which ever one you prefer (hint - John's is better!)

Attachments
Comments
MVP
MVP

Nice!

As a possible enhancement, I sometimes want the most-transparent ARGB equivalent to an RGB value. So for me, it would be nice to see the values in both RGB and ARGB.

A = 255-rangemin(R,G,B)
R = round(255*(1+(R-255)/A))
G = round(255*(1+(G-255)/A))
B = round(255*(1+(B-255)/A))

pat_agen
Valued Contributor

Mr Witherspoon!

long time no see!

I hope you are doing well. Looking forward to your take on how things have developed.

And nice looking document Ciaran.

0 Likes
Partner
Partner

Hi John, I've updated the QVW to include your idea so it should be available shortly. Thanks for your help!

0 Likes
MVP
MVP

I'm so downloading and using this.

MVP
MVP

For the color on your ARGB circle, you're still using vRed etc. instead of vAlpha_Red etc., which is why the color looks lighter than the main circle when it is intended to be an exact match.

0 Likes
MVP
MVP

This might be intentional, but the way you're darkening and lightening colors does more than darken and lighten - it changes the color. This is most easily seen if you select gray. The darker and lighter versions of this look pinkish or purplish instead of gray.

We can see why looking at the expressions, such as these.

LET vDarkest_Red = '=if((vRed-48)<0, 0, (vRed-48))';
LET vDarkest_Green = '=if((vGreen-69)<0, 0, (vGreen-69))';
LET vDarkest_Blue = '=if((vBlue-46)<0, 0, (vBlue-46))';

They're just subtracting fixed numbers. And even if the numbers were the same, that would only fix grays. other colors would be skewed still. I believe it would be color-neutral and eliminate the need for an if()  if we darkened and lightened by going a percentage of the distance between each color component and 255 or 0. The below does that and seems to produce similar results without the color changes.

LET vDarkest_Red = '=round(.4*vRed)';
LET vDarkest_Green = '=round(.4*vGreen)';
LET vDarkest_Blue = '=round(.4*vBlue)';
LET vDark_Red = '=round(.7*vRed)';
LET vDark_Green = '=round(.7*vGreen)';
LET vDark_Blue = '=round(.7*vBlue)';
LET vLight_Red = '=round(.7*vRed+.3*255)';
LET vLight_Green = '=round(.7*vGreen+.3*255)';
LET vLight_Blue = '=round(.7*vBlue+.3*255)';
LET vLightest_Red = '=round(.4*vRed+.6*255)';
LET vLightest_Green = '=round(.4*vGreen+.6*255)';
LET vLightest_Blue = '=round(.4*vBlue+.6*255)';

Old vs. Proposed Gray (alpha display has also been fixed):

Capture.PNG

Capture2.PNG

Old vs. Proposed Orange:

Capture3.PNG

Capture4.PNG

Partner
Partner

Hi John,

It was actually my intention to skew the colours, which is why the figures I'm subtracting are different. I was trying to find an alternative to Adam's original tool and build something that would behave more like the Paletton website. I didn't think

In hindsight, I think your approach is way better so I'm going to make your changes. I'll comment out my script and add a note so people can change it back if they want but I'd say your approach will be more popular! Might also have to rename the applicationl to the JW Qlik Simple Colour Tool!

Partner
Partner

Brilliant!

Thank you Ciaran (and John) for this most helpful tool!

Cheers!

MVP
MVP

Ah, good, I thought it might be intentional. The color variations it produces are very nice, and work very well with the original color. It's subtle enough that I don't even see it without something to compare to, or on a gray color. I'm glad you kept both versions in the script. I can see myself using both. I wouldn't say one or the other is better. They're just different approaches.

And this has little to do with functionality, but I love your sense of aesthetics in this. Lovely font, lovely layout. I sometimes say "our job isn't to impress, but to inform", but mostly I mean that we should keep it clean and simple. Well, yours is clean and simple and still impressive. This is a good example of what I want my applications to look like, but mine never look quite this good.

shun_wong
New Contributor III

This is a great tool!
Thank you and John for this!

0 Likes
Version history
Revision #:
1 of 1
Last update:
‎2016-07-05 12:50 PM
Updated by: