{"id":2658,"date":"2024-01-02T12:00:00","date_gmt":"2024-01-02T11:00:00","guid":{"rendered":"https:\/\/newdatalabs.com\/en\/?p=2658"},"modified":"2023-12-29T23:16:15","modified_gmt":"2023-12-29T22:16:15","slug":"colour-contrast-calculator-in-power-bi","status":"publish","type":"post","link":"https:\/\/newdatalabs.com\/en\/colour-contrast-calculator-in-power-bi\/","title":{"rendered":"Colour Contrast Calculator in Power BI"},"content":{"rendered":"\n

The number of UX enthusiasts who place great emphasis on the User Experience is rapidly growing. One of the factors that affect the way the report is perceived is the colour palette used in it. Today we are going to discuss how the Colour Contrast Calculator in Power BI\u00a0<\/strong><\/a>can help you in your work.<\/p>\n\n\n\n

Colour palette \u2013 where to start<\/h2>\n\n\n\n

The process of selecting colours should start with learning about the brand colours used by the company for which a report is going to be prepared. If there are no brand colours, choose the palette you would like to use. The colours selected are primarily intended to direct the user\u2019s attention in such a way that they can easily access the information needed. Colours are undoubtedly the key element of the visualization; however, it is reasonable to be moderate and use colours where appropriate only. The colour palette of the report should not interfere with the analytical process; therefore it is vitally important to combine the selected colours in a well-thought manner.<\/p>\n\n\n\n

Colour Contrast Calculator in Power BI<\/h2>\n\n\n\n

The question arises as to how to properly combine colours? For this purpose, it is worth using a variety of available tools, such as the colour contrast calculator which can be created directly in Power BI. This tool allows you to see whether the contrast between the colours you wish to use is sufficient. Below is the example contrast calculated in Power BI.<\/p>\n\n\n\n

The calculator is nothing more than a report created in Power BI based on the dataset generated in Power Query. The dataset consists of columns with R (red), G (green) and B (blue), which are used as a basis to create colours from the RGB palette. In addition, there is a colour column in a hexadecimal format \u2013 a HEX code. With such a set of data you can choose the desired colours and calculate their contrast ratio.<\/p>\n\n\n\n

<\/p>\n\n\n\n

\"\"<\/a><\/figure>\n\n\n\n

<\/p>\n\n\n\n

Colour contrast and WCAG standards<\/h2>\n\n\n\n

The colour contrast ratio is calculated in accordance with the guidelines of the WCAG standard. They stipulate that:<\/p>\n\n\n\n

\u00b7 The contrast between the text and the background should not be bigger than 4.5<\/p>\n\n\n\n

\u00b7 The contrast between non-text content (e.g., a chart) and the background should not be bigger than 3.<\/p>\n\n\n\n

This calculator is fast and simple to use. All you need to do is to select two colours you wish to combine and enter them in the fields \u201cSelect Colour 1\u201d and \u201cSelect Colour 2\u201d as a HEX code. Below you will see the details of your selection in HEX and RGB formats. On the right, you will see the analysis of the contrast between the two colours. Depending on the choices made, you can receive the following feedback:<\/p>\n\n\n\n