Customize Display with Color Kit

Can one have too many colors?
Yes:

65,536 (256 x 256); all possible graduations of Red and Blue, Green is totally absent. Best seen Full Screen & zoomed.
If this view were to be reproduced another 255 times, incrementing the value of Green by 1 on every pass, we would see every possible color once.
256 x 256 x 256 = 16,777,216 colors, corresponding to 24-bit color

Just a few years ago, or so it seems, we should have been so lucky.
The total number of colors - the size of the palette - that could be shown on a monitor was only 256 at a time; 8-bit color.
Web Browsers had to settle on a common palette, and adopted a set that has since been referred to as the 256 Web-Safe Colors.
These colors could then be displayed without dithering in all browsers.

216 of those are historically represented in a 6 x 6 Cubes arrangement, each cube consisting itself of 6 distinct colors:

WebColors_216.mq4 on Black. Download below, please.

Once the display is up, it is completely static. RGB Codes can be copied to Graphics on the chart. The rectangles can be dragged, copied, overlaid, etc.
Start with Black, White and the neutral Gray (128,128,128) as Backgrounds, to see how that affects appearance and contrast.
This is no end of fun for kids of all ages but, as a responsible adult, you may want to also look up things in the links below ;-)

In the RGB color coding system each component, Red, Green and Blue can take on a value between 0 and 255, for a total of 256.
By stepping through combinations of these values different colors will be displayed.

The step used for the 6x6 Cubes above is 51 (decimal).
For example, in the top row, to get from Black (R=0, G=0, B=0) to full Blue (R=0, G=0, B=255), "B" will take on values of 0, 51, 102, 153, 204 and 255.
Many references to the 216 Web-Safe Colors use Hexadecimal notation, and the same sequence is found repeated as 00, 33, 66, 99, CC and FF.

Only 8 of these 216 Web-Safe Colors are named as MT4 Web-colors, with others as Custom choice.
That means a fair amount of additional standard colors become available for use on screen.
The only Option in the Input Box is to write Data to file in folder "\MQL4\Files\Color Kit".
That CSV file will always have the same content, and can be imported into a spread sheet. (Copy attached.)
Please check Post #3 for some more images.

The following Links all have information directly related to RGB coding, the 216 Web-Safe 6x6 Cubes or MT4 Named Web-colors.
Some sites have additional content that will hook into using Hues, other classifications and color theories.

The most rational presentation of various standard colors. Hex only, but easy to follow.
The step for the Basic Colors there is 11hex or 17dec, giving a graduation over 16 elements:
WebColors - RGB Color Chart http://www.nikhef.nl/pub/computing/WebColors.php

By clicking on one of the Named Web-colors, all other colors can be seen on that background.
Useful for selecting stable colors accordingly:
HTML Color Names http://www.w3schools.com/tags/ref_colornames.asp
The site has been nicely reworked since first mention here.

Great presentations of matched colors:
Hex Hub HTML Color Codes: Hexadecimal codes for named colors used in HTML page features
http://www.december.com/html/spec/color.html

The MT4 named Web-colors closely correspond to these 147 color names defined by the Scalable Vector Graphics (SVG) Specification:
http://www.december.com/html/spec/colorsvg.html

The 6x6 cubes, but also a nice selection of Secondary/Mixed/Pastel Colors:
Complete HTML True Color Chart; Table of color codes for html documents
http://www.immigration-usa.com/html_colors.html

The Web-color palette Used in MT4, but grouped by Hue, excellent:
Color Names http://html-color-codes.info/color-names/

And http://www.visibone.com/
With, along much else, this beautifully laid out 216 Web-Safe Colors Palette:
Web Designer's Color Reference Poster by VisiBone http://www.visibone.com/color/poster4x.html
Also, useful information and links concerning Color Deficient Vision http://www.visibone.com/colorblind/

Please have fun.

Downloads:

More on this mq4 in Post #4 and up. Please get the User Info to go along:

Note: The spread sheet MT4 Custom-Basic Colors.xlsx first discussed in Post #7 has been completed with all colors named.
See Post #18 for details. Download is from Post #19. phew.

The Script mentioned in Post #8, MT4 Named Web-colors.mq4, has been updated and become more interesting.
Description and download from Post#15.

Upgraded with a far more functional Grid and Cross Hairs combination. Details on that in Post #26
First of a series. Walk-through coding/drawing/coloring. Read from Post #11 & up:
New: 00c Copy-Paste Functions.mq4. How To. Importing basic graphics functions, and the minimum required to work them.
Up and coding in minutes flat. Download from Post #13.

Practical Color Wheel Mixing. Description from Post #21 & up.
Upgraded: Better usability mostly. Presentation and details in Post #35

I've changed the blurb here a few times, but understatement goes only so far.
"This one is 100%, because it couldn't be more simple and one gets to do it all. Play school."
Also, looping the gray scale.

Thank You My Friend, really appreciate
best regard
MTH

The 6x6 outlay of the 216 Web-Safe Colors is not easy to figure out.
Blue is incremented by 51dec, across from left to right for every cube.
Red is equally incremented from top to bottom for every cube.
Green however, is sort of staggered-in, and fully incremented from 0 to 255 within every cube itself.

In the following views the colors Red, Lime, Blue, Cyan (Aqua), Magenta (Fuchsia) and Yellow have been selected and over-laid on the left.
Also selected are Black, White and, diagonally, four shades of Gray.
The influence of the different backgrounds is obvious, with Gray allowing for the most balanced range.

The cubes presentation has the advantage of being static and well documented, which makes it a bit of a primer.
Having more colors to choose from doesn't make the picking any easier though. Dither is the word ;-)

00c Color Cubes 256.mq4
Download from first post please, along with "Color Cubes User Info.doc", which describes the Input Box.

It will display Color Graduations over 256 Cubes in a separate window.
That number is fixed in the mq4, but by setting First and Last Colors the User has full control.

No graduations are seen on the trade screen in this version, but some serious play can be done though.
Play because quiet fun, and serious because results can also be complete and meaningful.
Complete in the sense that 256 is a "unit" in the 256 x 256 x 256 possibilities offered by 24-bit color.

Under certain conditions, such a unit can display all possible variations over a range between given starting and ending colors.
A good example is the Gray scale. First and Last Colors here are Black and White, not to quibble.
This is the best setting to get acquainted, knowing that all possible Grays in the RGB system are present:
Cubes have been selected along the Diagonal between top-left Black and bottom-right White.
One can think of them as median or middle colors, and they correspond to the 16 Grays at top of the following Web-page:
WebColors - RGB Color Chart http://www.nikhef.nl/pub/computing/WebColors.php

The step along that diagonal is 17dec or 11hex, which is also used to generate the other Basic Color sets found on that same page.
In Color Cubes 256.mq4, such selections are broken out and stacked to the left along with the RGB codes (optional).
A quick pick and standard "cross-cut" reference.

The condition for all 256 values of any one component R, G or B to be unique, is that its First and Last values be 0 and 255.
That is the case here and - since for Grays all RGB components run in tandem - a nice example of that principle:
There is an option to write RGB codes and named colors to file, see the User Info, please.
For Black and White a look at the text file is enough to get the idea.

Selecting on Color Names in a spread-sheet turns up the following named Grays in MT4:

Those locations have been tagged in the picture just above.
WhiteSmoke; never noticed that one before.

More Color Cubes 256.mq4

All these Grays, including Black and White have no color.
They are collectively qualified as achromatic; light without any hue.

In some color theories they are placed on a Verical axis, with hues ordered on a Horizontal disk.
As the disk slides up and down, the hues take on the Value or brightness of the corresponding Gray.
Taking a stack of basic Grays to symbolize the vertical axis and the color Blue as hue, we'll look at Shades, Tints and Tones.
For a very short explanation of what is involved, please consult this Wiki https://en.wikipedia.org/wiki/Tints_and_shades
To try this out, copy the top and bottom RGB codes from the pictures into the Input Box as User Colors.

Shades: The color Blue (0,0,255) needs to be darkened. The only way to do that is to give "B" progressively lower values toward 0, ending with Black (0,0,0).
All shades of Blue. In there is Navy, a half shade of Blue at (0,0,128), equivalent of Green (0,128,0) for Lime and Maroon (128,0,0) for Red.

Tints: Blue (0,0,255) needs to be lightened or whitened. This can be done by keeping B=255 and stepping through Red and Green from 0 to 255, ending with White (255,255,255).
All tints of Blue. Tints are also referred to as pastels.

Tones:
When mixing paints, toning is done by adding Gray, until one is satisfied or gives up in disgust ;-)

As seen before, for us shading and tinting consisted of pushing starting RGB values towards the extremes; 0 and 255.
In the same way, toning occurs when starting RGB values are pushed towards Gray (128,128,128).

This mq4 is set up to show graduations and that involves nothing but variations and combinations of just those three actions.

A general example of toning starting with a completely random color (19,168,243) and taking all RGB values to 128:
Not very exciting, but notice how the starting values are walked either up or down, but all towards 128.

An interesting form would be to keep 2 values at 128 and move the third from 0 to 255.
With Red from (0,128,128) to (255,128,128):
Teal shows top-left with Gray in the middle; the upper half consists of Tones of Teal.

The same trick with Green:
Now it's Purple in the upper corner and a range of tones.

With Blue:
Olive this time.
The other three colors in the lower corners all turn up in MT4 in the Custom/Basic colors box, no names found yet.

All this stuff with Gray looks a bit dim, but is hopefully a good way to start bottom-up.

Messing with the MT4 Custom Color Box:
With a closer look, it appears some order can be found after all: "MT4 Custom-Basic Colors.xlsx"
Many of these well known colors must have names which are missing above, or mistakes have been made.
The spread-sheet can be downloaded from first post and may be updated later for those reasons.

A way around in the box, is to look for colors which have 2 codes in common.
For example Green (0,128,0) is found with additional values for "B" at 64, 128 - Teal, 192 and 255 (next to Azure):

And with R=255 and G=128 as "root" we find Blue also at 0, 64, 128, 192 and 255:
No names for these colors.
Ten of the picks from the box are seen placed identically and other combinations will yield equivalent results of a sort.

And a late thank you for your appreciation Kiads, sorry I let that slip. Hope there will be more of interest.
apipshort

Below is a screen shot of all MT4 named Web-colors, result of a script copied from the MQL4 reference Documentation.
ObjectSetInteger - MQL4 Documentation That script can be downloaded from first post: MT4 Named Web-colors.mq4
Not really fancy, but the script has a ready-made Array with all Web-color Names; a lot of work done right there if your code requires it.

The Visible Spectrum.

The sequence for the banner a few posts back was taken from the following link:
Spectral Color at http://hyperphysics.phy-astr.gsu.edu/hbase/hframe.html

Below is a more complete version including Cyan between Blue and Green:
It shows mainly Vivid colors and follows the ordering along the curve of the CIE 1976 Chromaticity Diagram:
The 1976 Revision of the CIE Color System

Transitions from Blue to Red are found along the bottom edge of that diagram.
Those are figured below with Magenta in the middle:
Color Cubes 256 has not much to do with trading, but may provide both pleasure and insight.
If nothing else, it will stand in good stead next time the place needs redecorating ;-)

The Newton Color Circle.

For a short essential description of the Newton Color Circle and Predictions. please consult:
http://hyperphysics.phy-astr.gsu.edu...ewtcol.html#c1
Those explanations of Newton's Circle are simple and to the point, sufficient for working RGB on MT4.

The following link presents a general discussion of Color Wheels and use of additive and subtractive color models:
http://facweb.cs.depaul.edu/sgrais/color_wheel.htm

Pictorial: https://commons.wikimedia.org/wiki/Category:Colorwheels

Images from Isaac Newton's work: http://www.colorsystem.com/?page_id=683&lang=en

A page on additive and subtractive color systems and a great site: http://www.worqx.com/color/color_systems.htm

In retrospect Post #3 needs an overhaul.
The lay-out of primary and secondary colors there is random and no account given of the above-mentioned color models.

Primaries Red, Green and Blue on a Black background, interacting as predicted to form Secondary colors; Cyan, Magenta, Yellow:
Below, the primary and secondary colors are grouped to look like the symbols for ink-jet cartidges.
The results can be just as familiar as printing, but that depends on the Screen Background of the moment.

Here, still on a Black background; R, G and B combine to form the secondaries.
In addition, White results from mixing all three components; four new elements from three colors:
Spectral light as from the stars or a monitor are examples of the above process:

Melanie Safka, 1970.

And now look what they did to our colors ...

On a White background the opposite occurs; the CMY "cartridge" prints just like it would on white paper.
Three new colors are generated; Red, Green and Blue along with Black from the mix. Again four new elements:
On neutral Gray results are different yet again ...

When over-laying graphics on MT4 for color effects, the choice of background should probably be the first consideration.
This could all turn out worse than finger painting ;-)

00c Coloring_01 DoIntro.mq4
Download from foot of first post, please. There is no separate documentation.

The walk-through is all in the form of Comments.
Please use Editor Menu: Tools.Options and select a strong color for the Comments.
Maroon does well for me, but the default Gray is impossible for this job.

Putting colors to the screen. Neat, but that often requires coding.
I've tried to keep that aspect the least painful, with an eye to beginners.

Coloring_01 DoIntro.mq4, uses the same color graduation as Color Cubes 256.mq4
Selection of initial colors and the set of Color Choices is the same.
Added is control of screen fore- and background colors.
Please read up some, earlier in this thread, on that mq4 and its documentation before digging in here.

Digging in because we'll have to open the Editor. Hit F4 in the Terminal and select this mq4 for editing.
Also bring it up on any chart. By default, the first option; Do Intro is set to true.
This activates function DoIntro() just after line 170. Please, scroll down there.

You will find a manual in the form of comments and examples to work through.
Un-comment lines to activate them. After any changes, hit F7 to compile and see what happens.

And this is the drawing area:


Once happy with the Intro, set that option to false, and activate option Show Help Lines.
Code and comments in the start() function are now available in much the same way.
Put your own try-outs near the end of the Working Area.

Even if you have never coded, I bet you will come away with something.
As far as this intro goes, it is sufficient to modify some numbers or copy some lines to change behavior.
And that is exactly how everybody starts anyway. (read: gets hooked)

If already coding, one can copy/paste some functions to put basic graphical objects on-screen.
These should do in most Indies and EAs. Since we are calling them repeatedly, plenty of examples will be available.
Look for the code blocks at the end of programs. No OOPs there, and everything in one place.
One call to create object - after init or delete - and to later update any changed parameters; position, color, text etc.
It is all done by checking if(!) statements. Only if there are modifications will code be executed. Fast and stable overall.

This mq4 has a function; Parallels().
It uses series of color-graduated lines to draw Quadrilaterals, where opposite sides are parallel.
This means Squares, Rectangles, up to Parallelograms.

It's there to play with, but another mq4 should give it a workout.
A Trapezoids function is also needed to complete the above shapes.

For quick inspiration and to fiddle with some geometric shapes, do visit:
https://www.mathlearningcenter.org/w...attern-shapes/
and
https://www.math-salamanders.com/
where the following page defines some of the shapes we are aiming for:
https://www.math-salamanders.com/ima...-shapes-2d.gif
That last site, among much else, has pages showing many other shapes.

more ...

More 00c Coloring_01 DoIntro.mq4:

The layout for designing, consists of a 512 by 512 coordinates grid. That means 2 sets of 256 unique colors can be placed "end to end".
Horizontally we are printing on the bars, 0 to 511, so one must zoom out (+ and - on keypad) to second last setting.
Monthly TFs mostly will not have enough bars, and nothing will show.

Vertically we use a 0 to 511 scale (Indi Fixed max and min), the same way as Price on the chart.
That means we should pass the vertical P (price) values as doubles since the graphics functions are expecting it.

Drag up the Indi's border to get as square a grid as possible and off and away.

What's with the hinky numbers 127, 255, 383, etc.?
The problem is that when starting at 0, and counting that position, we hit these odd numbers.
When addressing colors by a full range of 256 or a typical subdivision like 128, 64, 32, we arrive 1 (one) short.
Printing 128 parallel lines, starting at 0, will put the last line at position 127.

In the code "range" is used to set the number of elements and colors to use.
As a general rule, printing "range" lines from coordinate X and counting that start position as #1, we wind up on X + (range-1).
Mostly this isn't a bother when messing, but when you are falling "one short" of an expected position, look again.

Initially, we only have numbers available for coding.
However, going through the Intro, you will find that the objective is to automate things to the point that a single function call will draw a complete shape. Once sufficient shapes have been assembled in an outlay, they can be moved around as a unit simply by setting another point as anchor to draw from.

Define a line. t1 = 127, t2 = 0, p1 and p2 = 255

Make 2 calls, giving range and a direction:

Parallels("P1", 127, 0, 255, 255, 128, "NW", false); // range=128, Direction North-West
Parallels("P2", 127, 0, 255, 255, 128, "SW", false); // South-West

00c Copy-Paste Functions.mq4

What with the gobs of code and such, it should be pretty well impossible to figure out what is needed to get rolling.
To that end, this mq4 is empty, save for the strict minimum required to work with the TrendLines() function.

Also, one can copy the other basic functions from one of the Coloring_x series. That set is not complete yet.
Add here as you come across a new one, and build up a file from which to start projects fresh.

Look for other examples, especially if you need the newer stuff.
Personally, I still think GOTO and GOSUB are the thing, and 64K RAM is a lot ;-)

00c Coloring_02 ParallelsA.mq4
Please, download from First Post. It is the second installment of the Coloring series, starting from Post #11.
Same format. Walk-through and code to experiment with.

We'll mainly be looking how to get from set-ups in start() to a final assembly of shapes in a function.
If that function is well made, it should be possible to copy the assembly all over, with different sizes and colors.
As the series goes forward, those functions will remain incorporated, resulting in a set of routines.

The Maltese Cross goes trough 3 versions. I'll be harping on how to avoid printing with negative bar numbers.
If any shape sticks out across Bar #0, the program will stop. To prevent this, some checking in the code will have to be done.
This is a "feature" of #property strict. Making out of bounds Array calls does the same, frequent when coding.
Typically, the comment line will not display anymore.

At the beginning of start() are two new sections:
1-) if(barTime != iTime(NULL,0,0)); Checking for a New Bar event.
If current value of barTime does not match the Open time of the current bar, we set flag newBar to true.
This flag can be checked anywhere in the code, but here it serves to isolate function calls, or other checks that should only run on Bar change.

A New Bar event will occur after every Input Box OK, compile, terminal restart, TF change etc,. The Bar Count will be 0 then (see the comment line).
After that only new bars will be counted. The Tick Count is just up, but can be used to animate every so many ticks, for instance.

2-) if(newBar); As usable designs appear, they will be added here, but commented out.
Useful for only updating "decorations" when they have to snap to the next new bar. Grid is the first candidate.
They can be activated any time and will only run when needed. Go here to copy examples of the principle calls to modify and use in start() or elsewhere.

And, be sure to manipulate flag "colorMe". It happens to give a nice effect, with just the default Color Swatches list.

Please, PM or post if you have suggestions or need clarification.
I apologize for "talking down" to experienced programmers but the subject itself, unusually useless code, could need an introduction.
Also, leaving others in the dust is bad form. Keep pounding F1 in there now ;-)

The shapes we have already run on the chart, but stretched way out on the price scale.
The increment of 1, used on the grid, translates into 100 or 1000 pips ... Much smaller increments like 0.0001 will be needed.

I don't want to put up any spoilers here, so this pic has nothing to do with actual code.
Result of early trial and error actually, running connecting lines up and down facing grid borders:
And, talking of Grids, see how it's really done:
https://www.connectingthreads.com/tu...ngles__D4.html
https://www.connectingthreads.com/tu...Pin__D103.html

Hey, if your spouse is a quilter you're golden.
"Honey, did you see my new design? Special for you. I hope you like it."
Dream on.

MT4 Named Web-colors.mq4
This is an update to Post #8.

The script that the link there referred to: https://docs.mql4.com/objects/objectsetinteger
needed only a tweak to become more interesting.

Here is another version, showing all MT4 web-colors fully named, in order of Color-pick Box:
https://docs.mql4.com/constants/obje...ants/webcolors

The present mq4 with the same name, replaces the MT4 Named Web-colors.mq4 mentioned in Post #8.
Previously it was downloaded from first post, but now can be found here, below.

The result of the modded script is display of both: color names in full and RGB code.
It is a combination of both tables, but the names here are now in Alphabetical order.

This makes it pretty easy to type the codes as User Colors into the Color Cubes 256.mq4 and the Coloring Series, or make new swatches.

Hover mouse for a read. Click to access text and copy all or part. Paste into another Chart or Code.

FWIW:

1. I posted the RGB values for the named colors (e.g. Goldenrod, SaddleBrown, MediumSeaGreen, etc) used in MT4's palette here.

2. Here and here are the download pages for two freeware color selector apps that I've found to be both useful and fun. Use Google to find plenty more!

3. Here is an interesting webpage (click different color schemes/options in the left margin of the page). Again, Google finds many similar pages.

4. Getting a little off-topic, but PicPick is the best free (for non-commercial use) screen capture/editor app I've found, and GIMP the most comprehensive free image editor.

Yes, thank you. Well worth it.
I'm trying out the color selectors and the screen capture app.
About time. Mine is looking a bit worse for use.

Good advice. I just re-posted the above pic, with much better results.
And I'm going nuts with the color pickers.

Thanks for pointing people the right way so often.
I think you were the first person to PM me years ago, after first post. Ding. Mail. Wow ;-)
apipshort

MT4 Custom Color Box: again.
This is a remake of Post #7.
Names have been put to all colors in the mt4 custom/basic colors box.
One or two maybe a toss-up, but most are from http://www.htmlcsscolor.com/
All non-named colors are in Italics.
The new spread-sheet: MT4 Custom-Basic Colors.xlsx is up at foot of first post.

Referring to Post #15, just above; Two colors there are mentioned twice in the outlay.
clrFuchsia, also named as clrMagenta in the big Array from the mq4 there.
clrAqua, also named clrCyan.

These two secondary colors can be called either way in code,
but when extracting the named colors to string, only the older names are returned.

Take a peek at: http://www.htmlcsscolor.com/color-gradient.
Looks familiar.

Gotcha. Running out of space in first post.
So, the MT4 Custom-Basic Colors.xlsx spread sheet shown just above finally gets posted here:

Newtonian ColorWheel Mixer.mq4.
Download is from first post.

The mixing is mostly in the brain as nothing moves by itself here.
With a bit of luck, first principles are squared away some, and coding possibly simplified.

Since this owns a lot to Hanover's recent advice, I think he should stand himself to a tall cool one ;-)
Yes, do get one of those color pickers up, especially before starting here.
Ignorance actually is not bliss, and I got to fetch up to getting Orange wrong since Color Cubes.
Look for an update there soon.

Newton's Rose:

The wheel is a demo, because made up only with indi coordinates.
The Triangle set-up, in the center after turning on Program Content option is a bit more lively, and a start to coded lay-out:

Some of that is done and allows effects like:

Interesting there are an upgraded grid, and a cute cross-hairs cursor to read off every single screen coordinate.
These will be going back into prior versions of the series as well.