Besides the standard TradingView colours, which are limited to 17 different colours, we can also work with countless other colours. How to do so?

In this article:

Working with hexadecimal colour values in TradingView

Colours in TradingView can be set manually but we can use them programmatically too. One approach are the easy-to-use basic TradingView colours. However, there are only 17 of those built-in color variables, which limits the number of suitable colours that we can use in a script.

An alternative are the hexadecimal colour values, which consist out of a number sign (#) followed by 6 hexadecimal digits (Pine Script Language Tutorial, n.d.). For instance, the red colour has a hexadecimal equivalent of #FF0000 while blue is #0000FF.

Such colour values are also called color literals (Pine Script Language Tutorial, n.d.) and web colours or hex triplets (Wikipedia, 2015). Their first two characters set the value for the red colour component, the next two the green colour component, and the third character pair defines the blue colour component (Pine Script Language Tutorial, n.d.). Each of these colour components ranges from 00 to FF (in hexadecimal notation) or from 0 to 255 (decimal notation), which allows for almost 16,8 million different colours (Wikipedia, 2015).

Note: Hexadecimal colour values in TradingView can be used in either upper or lowercase (Pine Script Language Tutorial, n.d.). That is, #ADFF2F and #adff2f are both green-yellow in TradingView.

Plotting and drawing with hexadecimal values in TradingView

The functions listed in the table below all have a color argument (TradingView, n.d.), and we can set that argument to any hexadecimal colour value or basic colour (Pine Script Language Tutorial, n.d.).

And so for example, we can use the forest green colour (#228B22) to colour the chart’s background like this: bgcolor(color=#228B22).

Function Description
barcolor() Sets the colour of price bars of the chart’s instrument.
bgcolor() Fills the chart’s background with a particular colour.
fill() Colours a background portion that’s between two plots or two horizontal lines.
hline() Draws a horizontal, coloured line at the specified price level.
plot() Plots a series of data in a certain colour.
plotarrow() Displays coloured up and down arrows on the chart.
plotbar() Plots OHLC bars in a particular colour.
plotcandle() Plots coloured price candles.
plotchar() Displays a coloured Unicode character.
plotshape() Plots coloured visual shapes on the chart.
Note: The na variable is not a colour, but it does act as the chart’s default colour (Pine Script Language Tutorial, n.d.). So a plot or drawing is transparent when its colour is set to na, which is a useful feature when using TradingView colours conditionally.

Hexadecimal colour values for TradingView

Hexadecimal colours make a lot of colours possible, but it’s also easy to get lost with colours that are barely ‘different’ from each other. And so below we look at a colour collection that contains enough colours to be useful but not that many that it becomes impractical.

To browse the colours more conveniently, the tables below sort them in different ways. Use one of the links below to quickly jump to a colour table:

After these tables we look at a hexadecimal colours programming example.

Hexadecimal colours sorted by lightness

The following table list hexadecimal colours sorted from very light to very dark:

Colour name Hexadecimal value Example
White #FFFFFF
White smoke #F5F5F5
Snow #FFFAFA
Misty rose #FFE4E1
Seashell #FFF5EE
Linen #FAF0E6
Antique white #FAEBD7
Blanched almond #FFEBCD
Papaya whip #FFEFD5
Old lace #FDF5E6
Floral white #FFFAF0
Cornsilk #FFF8DC
Lemon chiffon #FFFACD
Beige #F5F5DC
Light goldenrod yellow #FAFAD2
Ivory #FFFFF0
Light yellow #FFFFE0
Honeydew #F0FFF0
Mint cream #F5FFFA
Azure #F0FFFF
Light cyan #E0FFFF
Alice blue #F0F8FF
Lavender #E6E6FA
Ghost white #F8F8FF
Lavender blush #FFF0F5
Gainsboro #DCDCDC
Light grey #D3D3D3
Peach puff #FFDAB9
Bisque #FFE4C4
Navajo white #FFDEAD
Moccasin #FFE4B5
Wheat #F5DEB3
Pale goldenrod #EEE8AA
Pale turquoise #AFEEEE
Pink #FFC0CB
Light pink #FFB6C1
Silver #C0C0C0
Light coral #F08080
Salmon #FA8072
Light salmon #FFA07A
Burly wood #DEB887
Khaki #F0E68C
Light green #90EE90
Pale green #98FB98
Aquamarine #7FFFD4
Powder blue #B0E0E6
Light blue #ADD8E6
SkyBlue #87CEEB
Light sky blue #87CEFA
Light steel blue #B0C4DE
Thistle #D8BFD8
Plum #DDA0DD
Violet #EE82EE
Hot pink #FF69B4
Dark grey #A9A9A9
Rosy brown #BC8F8F
Tomato #FF6347
Dark salmon #E9967A
Coral #FF7F50
Sandy brown #F4A460
Tan #D2B48C
Dark sea green #8FBC8F
Medium aquamarine #66CDAA
Cornflower blue #6495ED
Medium slate blue #7B68EE
Medium purple #9370DB
Orchid #DA70D6
Pale violet red #DB7093
Grey #808080
Indian red #CD5C5C
Red #FF0000
Orange red #FF4500
Peru #CD853F
Dark orange #FF8C00
Orange #FFA500
Gold #FFD700
Dark khaki #BDB76B
Yellow #FFFF00
Yellow green #9ACD32
Green yellow #ADFF2F
Chartreuse #7FFF00
Lime green #32CD32
Lime #00FF00
Spring green #00FF7F
Turquoise #40E0D0
Medium turquoise #48D1CC
Cyan #00FFFF
Aqua #00FFFF
Cadet blue #5F9EA0
Deep sky blue #00BFFF
Dodger blue #1E90FF
Light slate grey #778899
Slate grey #708090
Royal blue #4169E1
Blue #0000FF
Slate blue #6A5ACD
Blue violet #8A2BE2
Medium orchid #BA55D3
Magenta #FF00FF
Fuchsia #FF00FF
Deep pink #FF1493
Dim grey #696969
Brown #A52A2A
Fire brick #B22222
Sienna #A0522D
Chocolate #D2691E
Goldenrod #DAA520
Lawn green #7CFC00
Medium sea green #3CB371
Medium spring green #00FA9A
Light sea green #20B2AA
Dark turquoise #00CED1
Steel blue #4682B4
Medium blue #0000CD
Dark orchid #9932CC
Dark violet #9400D3
Medium violet red #C71585
Crimson #DC143C
Saddle brown #8B4513
Dark goldenrod #B8860B
Olive drab #6B8E23
Dark olive green #556B2F
Forest green #228B22
Sea green #2E8B57
Dark slate blue #483D8B
Dark red #8B0000
Maroon #800000
Olive #808000
Green #008000
Dark slate grey #2F4F4F
Dark cyan #008B8B
Teal #008080
Midnight blue #191970
Dark blue #00008B
Navy #000080
Indigo #4B0082
Dark magenta #8B008B
Purple #800080
Dark green #006400
Black #000000

↑ Back to the list of tables.

Hexadecimal colours sorted by hue

The following table lists the hexadecimal colour values sorted by hue (that is, colour shades):

Colour name Hexadecimal value Example
Light pink #FFB6C1
Pink #FFC0CB
Crimson #DC143C
Lavender blush #FFF0F5
Pale violet red #DB7093
Hot pink #FF69B4
Deep pink #FF1493
Medium violet red #C71585
Orchid #DA70D6
Thistle #D8BFD8
Plum #DDA0DD
Violet #EE82EE
Magenta #FF00FF
Fuchsia #FF00FF
Dark magenta #8B008B
Purple #800080
Medium orchid #BA55D3
Dark violet #9400D3
Dark orchid #9932CC
Indigo #4B0082
Blue violet #8A2BE2
Medium purple #9370DB
Medium slate blue #7B68EE
Slate blue #6A5ACD
Dark slate blue #483D8B
Lavender #E6E6FA
Ghost white #F8F8FF
Blue #0000FF
Medium blue #0000CD
Midnight blue #191970
Dark blue #00008B
Navy #000080
Royal blue #4169E1
Cornflower blue #6495ED
Light steel blue #B0C4DE
Light slate grey #778899
Slate grey #708090
Dodger blue #1E90FF
Alice blue #F0F8FF
Steel blue #4682B4
Light sky blue #87CEFA
Sky blue #87CEEB
Deep sky blue #00BFFF
Light blue #ADD8E6
Powder blue #B0E0E6
Cadet blue #5F9EA0
Azure #F0FFFF
Light cyan #E0FFFF
Pale turquoise #AFEEEE
Cyan #00FFFF
Aqua #00FFFF
Dark turquoise #00CED1
Dark slate grey #2F4F4F
Dark cyan #008B8B
Teal #008080
Medium turquoise #48D1CC
Light sea green #20B2AA
Turquoise #40E0D0
Aquamarine #7FFFD4
Medium aquamarine #66CDAA
Medium spring green #00FA9A
Mint cream #F5FFFA
Spring green #00FF7F
Medium sea green #3CB371
Sea green #2E8B57
Honeydew #F0FFF0
Light green #90EE90
Pale green #98FB98
Dark sea green #8FBC8F
Lime green #32CD32
Lime #00FF00
Forest green #228B22
Green #008000
Dark green #006400
Chartreuse #7FFF00
Lawn green #7CFC00
Green yellow #ADFF2F
Dark olive green #556B2F
Yellow green #9ACD32
Olive drab #6B8E23
Beige #F5F5DC
Light goldenrod yellow #FAFAD2
Ivory #FFFFF0
Light yellow #FFFFE0
Yellow #FFFF00
Olive #808000
Dark khaki #BDB76B
Lemon chiffon #FFFACD
Pale goldenrod #EEE8AA
Khaki #F0E68C
Gold #FFD700
Cornsilk #FFF8DC
Goldenrod #DAA520
Dark goldenrod #B8860B
Floral white #FFFAF0
Old lace #FDF5E6
Wheat #F5DEB3
Moccasin #FFE4B5
Orange #FFA500
Papaya whip #FFEFD5
Blanched almond #FFEBCD
Navajo white #FFDEAD
Antique white #FAEBD7
Tan #D2B48C
Burly wood #DEB887
Bisque #FFE4C4
Dark orange #FF8C00
Linen #FAF0E6
Peru #CD853F
Peach puff #FFDAB9
Sandy brown #F4A460
Chocolate #D2691E
Saddle brown #8B4513
Seashell #FFF5EE
Sienna #A0522D
Light salmon #FFA07A
Coral #FF7F50
Orange red #FF4500
Dark salmon #E9967A
Tomato #FF6347
Misty rose #FFE4E1
Salmon #FA8072
Snow #FFFAFA
Light coral #F08080
Rosy brown #BC8F8F
Indian red #CD5C5C
Red #FF0000
Brown #A52A2A
Fire brick #B22222
Dark red #8B0000
Maroon #800000
White #FFFFFF
White smoke #F5F5F5
Gainsboro #DCDCDC
Light grey #D3D3D3
Silver #C0C0C0
Dark grey #A9A9A9
Grey #808080
Dim grey #696969
Black #000000

↑ Back to the list of tables.

Hexadecimal colours sorted by saturation

The following table lists the hexadecimal colour values sorted by intensity:

Colour name Hexadecimal value Example
Snow #FFFAFA
Misty rose #FFE4E1
Seashell #FFF5EE
Blanched almond #FFEBCD
Papaya whip #FFEFD5
Floral white #FFFAF0
Cornsilk #FFF8DC
Lemon chiffon #FFFACD
Ivory #FFFFF0
Light yellow #FFFFE0
Honeydew #F0FFF0
Mint cream #F5FFFA
Azure #F0FFFF
Light cyan #E0FFFF
Alice blue #F0F8FF
Ghost white #F8F8FF
Lavender blush #FFF0F5
Peach puff #FFDAB9
Bisque #FFE4C4
Navajo white #FFDEAD
Moccasin #FFE4B5
Pink #FFC0CB
Light pink #FFB6C1
Light salmon #FFA07A
Aquamarine #7FFFD4
Hot pink #FF69B4
Tomato #FF6347
Coral #FF7F50
Red #FF0000
Orange red #FF4500
Dark orange #FF8C00
Orange #FFA500
Gold #FFD700
Yellow #FFFF00
Green yellow #ADFF2F
Chartreuse #7FFF00
Lime #00FF00
Spring green #00FF7F
Cyan #00FFFF
Aqua #00FFFF
Deep sky blue #00BFFF
Dodger blue #1E90FF
Blue #0000FF
Magenta #FF00FF
Fuchsia #FF00FF
Deep pink #FF1493
Lawn green #7CFC00
Medium spring green #00FA9A
Dark turquoise #00CED1
Medium blue #0000CD
Dark violet #9400D3
Dark red #8B0000
Maroon #800000
Olive #808000
Green #008000
Dark cyan #008B8B
Teal #008080
Dark blue #00008B
Navy #000080
Indigo #4B0082
Dark magenta #8B008B
Purple #800080
Dark green #006400
Salmon #FA8072
Pale green #98FB98
Light sky blue #87CEFA
Old lace #FDF5E6
Light goldenrod yellow #FAFAD2
Sandy brown #F4A460
Medium violet red #C71585
Crimson #DC143C
Dark goldenrod #B8860B
Antique white #FAEBD7
Wheat #F5DEB3
Light coral #F08080
Khaki #F0E68C
Light green #90EE90
Sky blue #87CEEB
Violet #EE82EE
Dark salmon #E9967A
Cornflower blue #6495ED
Medium slate blue #7B68EE
Turquoise #40E0D0
Royal blue #4169E1
Blue violet #8A2BE2
Chocolate #D2691E
Goldenrod #DAA520
Saddle brown #8B4513
Linen #FAF0E6
Lavender #E6E6FA
Pale goldenrod #EEE8AA
Pale turquoise #AFEEEE
Yellow green #9ACD32
Lime green #32CD32
Fire brick #B22222
Light sea green #20B2AA
Dark orchid #9932CC
Olive drab #6B8E23
Forest green #228B22
Midnight blue #191970
Beige #F5F5DC
Burly wood #DEB887
Powder blue #B0E0E6
Light blue #ADD8E6
Medium aquamarine #66CDAA
Medium purple #9370DB
Orchid #DA70D6
Pale violet red #DB7093
Indian red #CD5C5C
Peru #CD853F
Medium turquoise #48D1CC
Slate blue #6A5ACD
Medium orchid #BA55D3
Brown #A52A2A
Sienna #A0522D
Sea green #2E8B57
Light steel blue #B0C4DE
Plum #DDA0DD
Tan #D2B48C
Medium sea green #3CB371
Steel blue #4682B4
Dark khaki #BDB76B
Dark olive green #556B2F
Dark slate blue #483D8B
Thistle #D8BFD8
Rosy brown #BC8F8F
Dark sea green #8FBC8F
Cadet blue #5F9EA0
Dark slate grey #2F4F4F
Light slate grey #778899
Slate grey #708090
White #FFFFFF
White smoke #F5F5F5
Gainsboro #DCDCDC
Light grey #D3D3D3
Silver #C0C0C0
Dark grey #A9A9A9
Grey #808080
Dim grey #696969
Black #000000

↑ Back to the list of tables.

Alphabetical list of hexadecimal colours

The table below lists the colours and their hexadecimal colour value alphabetically:

Colour name Hexadecimal value Example
Alice blue #F0F8FF
Antique white #FAEBD7
Aqua #00FFFF
Aquamarine #7FFFD4
Azure #F0FFFF
Beige #F5F5DC
Bisque #FFE4C4
Black #000000
Blanched almond #FFEBCD
Blue #0000FF
Blue violet #8A2BE2
Brown #A52A2A
Burly wood #DEB887
Cadet blue #5F9EA0
Chartreuse #7FFF00
Chocolate #D2691E
Coral #FF7F50
Cornflower blue #6495ED
Cornsilk #FFF8DC
Crimson #DC143C
Cyan #00FFFF
Dark blue #00008B
Dark cyan #008B8B
Dark goldenrod #B8860B
Dark grey #A9A9A9
Dark green #006400
Dark khaki #BDB76B
Dark magenta #8B008B
Dark olive green #556B2F
Dark orange #FF8C00
Dark orchid #9932CC
Dark red #8B0000
Dark salmon #E9967A
Dark sea green #8FBC8F
Dark slate blue #483D8B
Dark slate grey #2F4F4F
Dark turquoise #00CED1
Dark violet #9400D3
Deep pink #FF1493
Deep sky blue #00BFFF
Dim grey #696969
Dodger blue #1E90FF
Firebrick #B22222
Floral white #FFFAF0
Forest green #228B22
Fuchsia #FF00FF
Gainsboro #DCDCDC
Ghost white #F8F8FF
Gold #FFD700
Goldenrod #DAA520
Grey #808080
Green #008000
Green yellow #ADFF2F
Honeydew #F0FFF0
Hot pink #FF69B4
Indian red #CD5C5C
Indigo #4B0082
Ivory #FFFFF0
Khaki #F0E68C
Lavender #E6E6FA
Lavender blush #FFF0F5
Lawn green #7CFC00
Lemon chiffon #FFFACD
Light blue #ADD8E6
Light coral #F08080
Light cyan #E0FFFF
Light goldenrod yellow #FAFAD2
Light grey #D3D3D3
Light green #90EE90
Light pink #FFB6C1
Light salmon #FFA07A
Light sea green #20B2AA
Light sky blue #87CEFA
Light slate grey #778899
Light steel blue #B0C4DE
Light yellow #FFFFE0
Lime #00FF00
Lime green #32CD32
Linen #FAF0E6
Magenta #FF00FF
Maroon #800000
Medium aquamarine #66CDAA
Medium blue #0000CD
Medium orchid #BA55D3
Medium purple #9370DB
Medium sea green #3CB371
Medium slate blue #7B68EE
Medium spring green #00FA9A
Medium turquoise #48D1CC
Medium violet red #C71585
Midnight blue #191970
Mint cream #F5FFFA
Misty rose #FFE4E1
Moccasin #FFE4B5
Navajo white #FFDEAD
Navy #000080
Old lace #FDF5E6
Olive #808000
Olive drab #6B8E23
Orange #FFA500
Orange red #FF4500
Orchid #DA70D6
Pale goldenrod #EEE8AA
Pale green #98FB98
Pale turquoise #AFEEEE
Pale violet red #DB7093
Papaya whip #FFEFD5
Peach puff #FFDAB9
Peru #CD853F
Pink #FFC0CB
Plum #DDA0DD
Powder blue #B0E0E6
Purple #800080
Red #FF0000
Rosy brown #BC8F8F
Royal blue #4169E1
Saddle brown #8B4513
Salmon #FA8072
Sandy brown #F4A460
Sea green #2E8B57
Sea shell #FFF5EE
Sienna #A0522D
Silver #C0C0C0
Sky blue #87CEEB
Slate blue #6A5ACD
Slate grey #708090
Snow #FFFAFA
Spring green #00FF7F
Steel blue #4682B4
Tan #D2B48C
Teal #008080
Thistle #D8BFD8
Tomato #FF6347
Turquoise #40E0D0
Violet #EE82EE
Wheat #F5DEB3
White #FFFFFF
White smoke #F5F5F5
Yellow #FFFF00
Yellow green #9ACD32

↑ Back to the list of tables.

Example: colouring a TradingView plot with hexadecimal values

The following example uses hexadecimal colour values to plot the momentum and the exponential moving average (EMA) of the momentum:

study(title="Momentum - coloured")

// Inputs
srcData   = input(title="Data", type=source, defval=close)
momLength = input(title="Momentum length", type=integer, defval=15)
emaLength = input(title="EMA length", type=integer, defval=45)

// Calculate values
momentum = mom(srcData, momLength)
emaValue = ema(momentum, emaLength)

// Plot values
plot(series=momentum, color=#DC143C) // Crimson
plot(series=emaValue, color=#7B68EE) // Medium slate blue

This indicator begins with the mandatory study() function. Then we add three inputs to the script: one source data input and two numerical integer inputs:

srcData   = input(title="Data", type=source, defval=close)
momLength = input(title="Momentum length", type=integer, defval=15)
emaLength = input(title="EMA length", type=integer, defval=45)

These input options are made with input(), a function that adds user-definable settings to a script (TradingView, n.d.). The first input has its type set to source with a default value (defval) of close. This input allows us to select different kinds of source data (like close, high, or low prices), and this option’s current value is stored in the srcData input variable.

The second and third inputs are set to integer (whole numbers) with default values of 15 and 45. The first is named “Momentum length” and its value is stored in the momLength input variable. The second integer is called “EMA length” and tracked in the emaLength input variable. Since each input’s value is assigned to a variable, changing the script’s settings by hand causes the variable’s value in the source code to change too.

We then calculate the momentum and its EMA:

momentum = mom(srcData, momLength)
emaValue = ema(momentum, emaLength)

For the momentum we use the mom() function, which requires a series of values plus an integer that specifies the offset from the current to a previous bar (TradingView, n.d.). We set the first argument to the srcData input variable (which holds closing prices by default) while the second argument is set to the momLength input variable. The value that mom() calculates is stored in the momentum variable.

Then we calculate the momentum EMA with ema(). This function requires two arguments: a series of data and the number of bars to calculate the moving average on (TradingView, n.d.). In it we pass momentum together with the emaLength input variable. The value that ema() calculates is stored in the emaValue variable.

After determining the values we plot them on the chart:

plot(series=momentum, color=#DC143C) // Crimson
plot(series=emaValue, color=#7B68EE) // Medium slate blue

The plot() function displays a series of data on the chart that are plotted as a line by default (Pine Script Language Tutorial, n.d.). In the first plot() statement we set its series argument to the momentum variable and the color argument to #DC143C (crimson). The last line plots the momentum EMA (emaValue) with the #7B68EE hexadecimal colour value (medium slate blue).

Plotting with hexadecimal values in TradingView

When the above example indicator is added to a GBP/USD chart, it looks like:

Example of a momentum plot in TradingView

And when added to a EUR/USD chart:

Example of a TradingView indicator coloured with hexadecimal colours

Our example script has the following input options:

Example of the TradingView script's input options
Tip: When the same script is added repeatedly to the chart, its colours are shifted. This means that medium slate blue (#7B68EE) doesn’t always look like its hexadecimal colour value, but can shift to slate blue, medium purple, navy, or even a colour without a shade of blue. For more on this, see shifted colours in TradingView.

For more colour examples, see colouring price bars, using colours conditionally, and colouring the background of a TradingView chart. We can also use hexadecimal colour values for more advanced topics like gradient colours in TradingView.

Summary

Using colours programmatically in TradingView is done with 17 basic colours or with countless of hexadecimal colour values. Those colour literals consist out of the # sign followed by 6 alphanumeric characters in upper or lowercase. When the same colour is used repeatedly, its value is shifted and so the displayed colour may differ from its actual hexadecimal value.


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 November 19, 2015, from https://www.tradingview.com/study-script-reference/

Wikipedia (2015, October 18). Web colors. Retrieved on November 12, 2015, from https://en.wikipedia.org/w/index.php?title=Web_colors&oldid=686371791