23. Report and Dashboard Design Principles
23.3 Colour
- Use a limited palette: one or two main colours plus neutral greys. Highlight only what needs attention.
- Keep meaning consistent: e.g. green = good, red = bad; the same category always gets the same colour on every page.
- Avoid rainbow colours for categories that have no special meaning.
- Use sequential palettes (light, then dark) for low-to-high values and diverging palettes (red ← white, then green) for values around a midpoint such as 0% growth.
- Ensure enough contrast between text and background.
Colour is a claim. Green says "leave this store alone today". Red says "open this one". If every city has its own colour, nothing is a claim. The reader gets a legend to memorise and still does not know who is late.
Use one neutral colour for "inside the promise or not the point", and spend the strong colour only on the exception. In the Nashik sketch, College Road can be neutral or a calm green. Gangapur is the only bar that needs the warning colour. Satpur at 80% does not need to shout. If Satpur also shouts, Shraddha has two emergencies and no way to rank them.
Keep the claim stable across pages. If Blinkit is one colour and Amazon Now is another on the platform page, those two colours should not also mean good and bad on the delivery page. Meaning collides, and the Monday call spends its time on the legend.
Sequential colour (light to dark) is for "more of the same", such as orders by hour, where a dark hour is a busy hour and not automatically a bad hour. Diverging colour is for a midpoint you have written down, such as 0% variance against a target, or a delivery rate against the promise. Do not use a diverging palette for store names. Store names have no midpoint.
Contrast is part of the same claim. A pale red on a white card, read on a projector in a bright room, is not a claim. It is a decoration that disappears. Dark text, a label that says the rate, and an icon or the word "late" next to the colour. Section 23.6 is the rule. This section is the reason: the business loses the name when the only signal is a hue someone cannot see.
Ravindra Bagale's Tip
Friends, many students use a different colour for every bar and city, which makes the page noisy. Use one neutral colour and highlight only what matters (for example the city below target in red). Keep the same colour for the same thing (Blinkit, Amazon Now) on every page. Try it once more, then move on.
Ravindra Bagale's Tip – मराठी
मित्रांनो, बरेच students प्रत्येक bar आणि city साठी वेगळा रंग वापरतात, त्यामुळे page गोंगाटाचं दिसतं. एक neutral रंग वापरा आणि फक्त महत्त्वाचं highlight करा (उदाहरणार्थ target च्या खाली असलेली city लाल रंगात). प्रत्येक page वर एकाच गोष्टीसाठी (Blinkit, Amazon Now) तोच रंग ठेवा. पुन्हा एकदा करून बघा, मग पुढे जा.
Ravindra Bagale's Tip – हिंदी
दोस्तों, बहुत से students हर bar और city के लिए अलग रंग इस्तेमाल करते हैं, जिससे page शोर-भरा लगता है. एक neutral रंग इस्तेमाल करो और सिर्फ़ ज़रूरी चीज़ highlight करो (जैसे target से नीचे वाली city लाल में). हर page पर एक ही चीज़ (Blinkit, Amazon Now) के लिए वही रंग रखो. एक बार फिर करके देखो, फिर आगे बढ़ो.
Fix common mistakes
| Wrong result | Reason | Correction |
|---|---|---|
| Every bar a different colour | Default data colours per category | One neutral colour + one highlight |
| Blinkit green on one page, orange on another | Inconsistent colours | Fix brand colours in the theme |
About this data: This table uses columns: Wrong result, Reason, Correction. Values shown are the lesson examples already on this page (not a new dataset).
Practise independently
Practice task
In the City bar chart, highlight only the city with the lowest sales.
Practice file (fictional): visuals_orders_apr_may_2026.csv
Hints
- Compare 850, 800, 450.
Solution
Kolhapur (₹450) in the highlight colour; Pune and Nashik grey.
Revision card