Red and Green Candles: Designing Colorblind-Friendly Trading Charts

Open almost any trading app and the story is told in two colors. Green candles mean the price rose, red candles mean it fell. It is one of the most familiar conventions in finance, and it works well for most people most of the time.

For a large group of users, though, red and green are exactly the two colors that are hardest to tell apart. A chart that looks crisp and obvious on a designer's monitor can turn into a row of muddy, near-identical shapes.

This piece looks at why that happens, how candlestick chart colors are used today, and how to design a colorblind friendly palette for financial charts without breaking the conventions traders rely on.

How a candlestick chart encodes information

Each candle summarizes price movement over a period, such as one minute, one hour or one day. The thick body runs between the opening and closing price. Thin lines above and below, called wicks or shadows, mark the highest and lowest prices reached.

Color carries one extra piece of information: direction. If the close is above the open, the candle is usually drawn green or hollow. If the close is below the open, it is red or filled.

The format traces back to Japanese rice traders in the 18th century and became widespread in Western markets in the 1990s. The original charts used black and white bodies. Red and green came later, with screens.

Why red and green fail so many readers

Color vision deficiency is common. Charities such as Colour Blind Awareness estimate that it affects around 1 in 12 men and 1 in 200 women. The most frequent forms reduce sensitivity to red or green light.

For someone with a red-green deficiency, a green candle chart and a red one can look like two shades of brownish olive. The difference is there, but faint, and it gets harder to see on small screens, in bright light or at a quick glance.

That matters because the whole point of a candlestick chart is quick reading. If direction has to be worked out by comparing the open and close of each candle, the chart has lost most of its value.

There is also a cultural wrinkle. In mainland China, Taiwan and South Korea, red typically marks a rising price and green a falling one. A global product cannot assume that color alone tells everyone the same story.

Building a colorblind friendly palette for charts

The most reliable fix is to choose two colors that differ in lightness as well as hue. A light and a dark color remain distinguishable even when the hue itself is hard to perceive.

Blue and orange is the pairing many data visualization guides recommend. The Okabe–Ito palette, published by Masataka Okabe and Kei Ito in 2008, is a widely used reference set built for exactly this problem, and its blue, orange and vermilion work well for up and down states.

A practical approach for a color blind friendly color palette in a trading interface:

Keep a strong lightness gap. Make one direction noticeably lighter than the other. Check the pair in grayscale; if both candles turn the same gray, the palette is not doing its job.

Check contrast against the background. WCAG 2.1 asks for a contrast ratio of at least 3:1 for meaningful graphical elements against adjacent colors. Thin wicks on a dark background often fall short.

Stay close to convention where you can. A blue-green for rises and an orange-red for falls keeps the familiar meaning while widening the difference for users with red-green deficiencies.

Offer a preset. Rather than replacing the default for everyone, add a clearly named color-safe theme in the chart settings.

If you are starting from an existing brand image or screenshot, our color palette extractor can pull the actual colors out so you can test and adjust them.

A worked example with real values

The Okabe–Ito set gives you concrete starting points. Its blue is #0072B2, its bluish green is #009E73, its orange is #E69F00 and its vermilion is #D55E00.

One workable pairing for a dark-mode chart is bluish green for rising candles and vermilion for falling ones, with hollow bodies on the rising side. The hues still read as "up" and "down" to most traders, while the lightness difference and the fill do the heavy lifting for everyone else.

On a light background, swapping the bluish green for the deeper blue often gives a cleaner contrast. Whatever you choose, treat it as a data visualization color blind friendly palette to be tested, not a final answer.

Don't rely on color alone

Good data visualization never depends on one channel. WCAG's "Use of Color" rule says color should not be the only way information is conveyed, and charts are no exception.

Candlesticks already have a built-in second channel: fill. Hollow bodies for rising candles and filled bodies for falling ones were the norm long before color screens, and many charting platforms still offer them as an option.

Other cues help too. A small arrow or plus and minus sign in tooltips, a clearly labeled change figure next to the price, or a subtle pattern on volume bars can all carry direction without color.

Line and area charts benefit from the same thinking. Use different line styles, direct labels at the end of each series and markers on key points, so users do not have to match colors against a legend.

Testing your trading chart colors

You do not need special equipment to check your work. Chrome DevTools includes vision deficiency emulation in its Rendering panel, with options for protanopia, deuteranopia, tritanopia and achromatopsia. Firefox's accessibility tools offer similar simulations.

Run your chart through each mode and ask two questions. Can you tell rising from falling candles at a glance? Can you still read the wicks, gridlines and labels?

It is also worth testing at real sizes. A palette that passes on a 27-inch monitor may fail on a phone in sunlight. Zoom out, dim the screen and look again.

Most importantly, ask real users. People with color vision deficiency are often very good at explaining what works and what does not, and they will notice issues a simulator misses.

Trading platforms already let users choose

Many popular platforms treat color as a user preference. TradingView, for example, lets users change candle body, border and wick colors in the chart settings, and similar options exist in desktop brokerage software.

That is good practice for any financial product. A sensible default, a color-safe preset and full customization together cover nearly everyone.

Charts are everywhere in market coverage, from stock apps to crypto news. Norwegian news site kryptobot.no, which reports on automated crypto trading, bots and market moves, is a good example of how much daily reading depends on price charts being legible at a glance.

The design principle underneath

None of this is unique to finance. It is the same principle behind any accessible interface: important information should survive when one sense or one channel is weakened.

Our practical accessibility checklist covers the wider picture, and the basics of hue, value and contrast are explained in our guide to color theory for web designers.

For candlestick charts specifically, the recipe is short. Pick colors that differ in lightness, keep the fill convention, test with simulators and real people, and let users switch themes. Red and green can stay. They just should not have to do all the work alone.