When we specify a certain colour in the code of our indicator or strategy, the script doesn’t use those colours when the script is added more than once to the chart. What’s going on here?

In this article:

The same TradingView script, but different colours

The colours that we can program with in TradingView are the basic TradingView colours and the hexadecimal colour values. However, the colours that we choose are not always the same as the colours that are actually displayed on the chart. Instead, the chart colours can be a different shade of the original colour or even be an unrelated colour.

These ‘shifted’ colours happen whenever the same script is added to the same chart more than once (vitvlk, 2015). This ‘colour shift’ also occurs when the script is already on the chart, but has its code edited and saved. TradingView then recreates the script on the chart, likely with slightly different colours.

These changed colours make it easier to distinguish between multiple instances of the same script. But its negative consequence is that a script’s colours can differ strongly compared to the colours that we deliberately chose to have on the chart, as we’ll see in the examples below.

Note: ‘Shifted’ colours seem to be a TradingView feature by design (see vitvlk, 2015). Currently, the only way to prevent TradingView from changing colours automatically is to add all the code in the same script (if possible). That way the script doesn’t need to be added to the same chart repeatedly (an example of this is discussed in this article).

Shifting colours in TradingView with the basic colours

To see how basic TradingView colours can be ‘shifted’, let’s first create a simple script that plots a green Exponential Moving Average (EMA):

study(title="Colouring repeatedly", overlay=true)

// Input
emaLength = input(title="EMA Length", type=integer, defval=20)

// Plot
plot(series=ema(close, emaLength), color=green, linewidth=3)

We first define the indicator’s properties with the study() function and two of its arguments: title (which specifies the script’s name) and overlay. That argument, when set to true, displays the script on the chart’s instrument and not in a subchart (TradingView, n.d.).

Then we create a numerical integer input option by setting the type argument of the input() function to integer (Pine Script Language Tutorial, n.d.). We name this input “EMA Length” and set its default value to 20 (defval=20). The input() function not only creates a option in the script’s settings but also returns that input’s value (TradingView, n.d.), and here we assign that value to the emaLength variable.

With plot() we display the EMA on the chart. That function plots the data of its series argument on the chart (TradingView, n.d.), and here we’ve set that argument to the value returned by ema(). That function calculates an EMA based on two values: a series of data (set to closing prices with close here) and the moving average length in number of bars (TradingView, n.d.). For that latter we use the emaLength input variable.

The plot() function makes a line by default (TradingView, n.d.), and here that line is set to the green basic TradingView colour with a linewidth of 3, which makes our line one step removed from being the thickest line possible.

The example indicator looks like this when added to a S&P 500 Index CFD chart:

Example of a TradingView script with basic colours

The script’s input option is the following:

Example of the TradingView script's input options

Using a script with a basic TradingView colour repeatedly

Now let’s see how the colours ‘shift’ when this example indicator is added several times to the chart. The second instance of this script, this time with a length of 30 bars, makes the chart look like:

Adding the TradingView script another time to the chart

Here we can already see a notable colour difference between both EMA lines, but let’s keep adding the same script. Here we’ve added it for the third time, now with a length of 40 bars:

Adding the moving average again to the TradingView chart

Then after adding the indicator with a period setting of 50:

Adding the moving average with basic colours again to the chart

Let’s add the same indicator three additional times with period settings of 60, 70, and 80 bars:

Adding three more instances of the same moving average in TradingView

The indicator that plot’s an EMA line set to the green basic TradingView colour now has been added 7 times to the same chart. However, only one of the lines is actual plotted in solid green.

If we analyse the line colours and convert their hexadecimal colours to a colour name from a list of colours by Wikipedia with Gauth’s (2011) tool, then our TradingView script behaved as follows:

Script # green becomes Example Approx. colour name
1 #008000 Green
2 #59AC72 Medium sea green
3 #59AC8B Cadet blue
4 #59ACA4 Cadet blue
5 #599BAC Cadet blue
6 #5983AC Air Force blue
7 #596AAC UCLA blue

Now let’s see how hexadecimal colours are shifted by TradingView.

Changing colours in TradingView with hexadecimal colours

These fluctuating colours also happen when the script uses hexadecimal colour values, and with these colours the ‘shifting’ effect seems even more pronounced. To inspect this more closely, let’s first change our example script so that it uses a hexadecimal colour value:

study(title="Colouring repeatedly", overlay=true)

// Input
emaLength = input(title="EMA Length", type=integer, defval=20, step=5)

// Plot
plot(series=ema(close, emaLength), color=#1E90FF, linewidth=3)

The only difference in this script version (compared to the previous) is that the color argument of the plot() function is now set to #1E90FF, which is the hexadecimal colour value of dodger blue.

When we add this version of the script to the chart for the first time, it looks like:

TradingView script that uses hexadecimal colours

Adding a TradingView script with a hexadecimal colour repeatedly

Now let’s look at how this colour progressively changes when the same script is added repeatedly to the chart. The second instance of the ‘Colouring repeatedly’ script already displays its EMA line in a purple shade:

Added another moving average script to the TradingView chart

Adding the script for the third time shifts the line colour to purple:

Added the third moving average to the TradingView chart

With the same indicator added again, this time with a period length of 50, the chart looks like:

TradingView chart after adding a 50-bar moving average

Now when the script is added three additional times, the line colour shifts to pink:

Adding three additional moving averages to the TradingView chart

Seven times is the indicator that plots a dodger blue EMA line added to the chart now. But only one of these lines is actually plotted in that light-blue tint.

When we analyse the different line colours and convert their displayed colours to a colour name from Wikipedia’s list of colours with Gauth’s (2011) tool, then our TradingView script behaved like this:

Script # Dodger blue becomes Example Approx. colour name
1 #1E90FF Dodger blue
2 #6D8AFF Cornflower blue
3 #7A6DFF Medium slate blue
4 #A66DFF Lavender indigo
5 #D26DFF Heliotrope
6 #FE6DFF Ultra pink
7 #FF6DD4 Rose pink

Luckily, in some situations there’s a workaround that prevents TradingView from shifting colours.

How to prevent TradingView from changing the script’s colours?

Currently, the only way to prevent TradingView from shifting a script’s colours is to eliminate the need for multiple scripts. While combining the code of several script instances into a single indicator or strategy script is not always an option, in the case of the basic script example discussed above it’s a viable alternative.

So instead of adding the script that plots a single moving average line multiple times to the chart, we can also create a single script that plots several moving average lines. For instance:

study(title="Colouring repeatedly - single script", overlay=true)

// Input
emaLength = input(title="EMA Length", type=integer, defval=20, step=5)

// Plots
plot(series=ema(close, emaLength), color=#1E90FF, linewidth=3)
plot(series=ema(close, emaLength + 10), color=#1E90FF, linewidth=3)
plot(series=ema(close, emaLength + 20), color=#1E90FF, linewidth=3)
plot(series=ema(close, emaLength + 30), color=#1E90FF, linewidth=3)
plot(series=ema(close, emaLength + 40), color=#1E90FF, linewidth=3)
plot(series=ema(close, emaLength + 50), color=#1E90FF, linewidth=3)
plot(series=ema(close, emaLength + 60), color=#1E90FF, linewidth=3)

Here we use the plot() function repeatedly to plot the moving averages. Each plot() statement has its color argument set to #1E90FF, the hexadecimal colour value of dodger blue. We set the length of each ema() function to the value of the emaLength input variable, which in all but one case we increase with a fixed value that ranges from 10 to 60. This way the EMAs are plotted with the same length as the several script instances that we added to the chart in the previous examples.

Now when we add this single script to the chart, each of the moving average lines is given the same colour:

Multiple moving averages plotted in one TradingView script

To learn more about working with colours in TradingView Pine, see changing colours conditionally and using gradient-like colours in TradingView. The different colours that we can use programmatically in TradingView are the standard colours as well as hexadecimal colour values.

Summary

Whenever the same TradingView script is added to the same chart more than once, the script’s colours ‘shift’. These altered colours begin with a colour similar to the original one but can end up with a completely different colour. While this helps to distinguish between different instances of the same script, it also makes our script use other colours than we specified in the script’s code. A workaround that prevents TradingView from changing the scripts’ colours is to combine the code into a single indicator or strategy whenever possible.


References

Pine Script Language Tutorial (n.d.). Retrieved on October 23, 2015, from https://docs.google.com/document/d/1sCfC873xJEMV7MGzt1L70JTStTE9kcG2q-LDuWWkBeY/

TradingView (n.d.). Script Language Reference Manual. Retrieved on February 10, 2016, from https://www.tradingview.com/study-script-reference/

vitvlkv (2015, June 1). Hex Color chart for Trading View? Discussion. Retrieved on February 10, 2016, from https://getsatisfaction.com/tradingview/topics/hex-color-chart-for-trading-view#reply_15751024

Gauth (2011, September 26). Get a color name from any RGB combination. Retrieved on February 15, 2016, from http://gauth.fr/2011/09/get-a-color-name-from-any-rgb-combination/