COLOR MIXTURE EA: Paint Your Charts with Vibrant Gradients

Introduction

Hello, future forex artist! Picture your MetaTrader 5 chart as a blank canvas, waiting for a splash of color to make price action pop. The COLOR MIXTURE EA is your master brush, painting a dynamic background with a gradient of 100 rectangles transitioning from deep black to vivid blue. This EA doesn’t trade but transforms your chart into a visual masterpiece, enhancing your analysis with flair. This article is your artist’s sketchbook, guiding you through the MQL5 code with vivid detail. We’ll unpack every major function with clarity for beginners, weaving humor and flow like a painter’s tale by a campfire. By the end, you’ll be ready to let this Expert Advisor (EA) color your charts with style. Let’s start painting!

Strategy Blueprint

The COLOR MIXTURE EA creates a visual overlay on your chart:

• Single Rectangle: The "createRect()" function draws a solid blue rectangle (RGB: 0,0,255) spanning the chart’s visible price range (max to min) and bars (first visible to last).

• Gradient Rectangles: The "createRect_A()" function layers 100 rectangles, each covering 1/100th of the price range, with colors transitioning from black (RGB: 0,0,0) at the top to blue (RGB: 0,0,200) at the bottom.

• Dynamic Updates: Runs on every tick to adjust rectangles to the chart’s visible range, ensuring the gradient stays vibrant.

• Color Calculation: The "trimCOLOR()" function interpolates RGB values for a smooth gradient.

This EA enhances chart readability, making price action stand out like a painting against a dynamic backdrop. It’s ideal for visual traders pairing it with other strategies. See below.

Code Implementation

Let’s paint through the MQL5 code like an artist brushing colors on a canvas, unfolding the logic as a seamless masterpiece. Our journey starts with setting up the EA, moves to drawing a single rectangle, layers a gradient of 100 rectangles, and calculates dynamic colors. Each function builds on the last, with transitions that keep the narrative flowing like a painter’s stroke. We’ll explain every major function in detail, quoting variables (e.g., "objName") and functions (e.g., "createRect()") for clarity, keeping it beginner-friendly with a painting theme.

Preparing the Canvas: Header and Standard Functions

Our artistic journey begins by setting up the canvas, preparing the EA to paint the chart.

//+------------------------------------------------------------------+
//|                                             COLOR MIXTURE EA.mq5 |
//|                        Copyright 2025, Allan Munene Mutiiria      |
//|                            https://www.mql5.com                   |
//+------------------------------------------------------------------+
#property copyright "Copyright 2025, Allan Munene Mutiiria"
#property link      "https://www.mql5.com"
#property version   "1.00"
//+------------------------------------------------------------------+
//| Expert initialization function                                   |
//+------------------------------------------------------------------+
int OnInit(){
   createRect_A();
   return(INIT_SUCCEEDED);
}
//+------------------------------------------------------------------+
//| Expert deinitialization function                                 |
//+------------------------------------------------------------------+
void OnDeinit(const int reason)
{
}
//+------------------------------------------------------------------+
//| Expert tick function                                             |
//+------------------------------------------------------------------+
void OnTick(){
   createRect_A();
}

The header declares the EA as “COLOR MIXTURE EA,” crafted by Allan in 2025, with a link to your site and version 1.00, setting the canvas’s borders.

• "OnInit()": The EA’s setup, called when attached to a chart. It calls "createRect_A()" to paint the gradient and returns INIT_SUCCEEDED, a constant signaling a smooth start, like stretching a fresh canvas.

• "OnDeinit()": The cleanup function, called when removed. It’s empty, like leaving the studio pristine, as no resources need freeing.

• "OnTick()": The EA’s heartbeat, running on every price tick. It calls "createRect_A()" to update the gradient, like refreshing the canvas with each market move.

These functions prepare the canvas, setting the stage for a vibrant painting.

Painting the Base Layer: createRect Function

With the canvas ready, we brush on a base layer—a single blue rectangle to test or fallback.

void createRect(){
   string objName = "RECT";
   
   double chartPriceMax = ChartGetDouble(0,CHART_PRICE_MAX);
   double chartPriceMin = ChartGetDouble(0,CHART_PRICE_MIN);
   
   datetime timeFirstVisibleBar = iTime(_Symbol,_Period,(int)ChartGetInteger(0,CHART_FIRST_VISIBLE_BAR));
   int barsChart = (int)ChartGetInteger(0,CHART_FIRST_VISIBLE_BAR) - (int)ChartGetInteger(0,CHART_VISIBLE_BARS);
   if (barsChart < 0) barsChart = 0;
   
   datetime time2 = iTime(_Symbol,_Period,barsChart);
   
   if (ObjectFind(0,objName) < 0){
      ObjectCreate(0,objName,OBJ_RECTANGLE,0,timeFirstVisibleBar,chartPriceMax,time2,chartPriceMin);
      Print("CREATED RECTANGLE");
   }
   ObjectSetInteger(0,objName,OBJPROP_TIME,0,timeFirstVisibleBar);
   ObjectSetDouble(0,objName,OBJPROP_PRICE,0,chartPriceMax);
   ObjectSetInteger(0,objName,OBJPROP_TIME,1,time2);
   ObjectSetDouble(0,objName,OBJPROP_PRICE,1,chartPriceMin);
   ObjectSetInteger(0,objName,OBJPROP_COLOR,C'000,000,255');
   ObjectSetInteger(0,objName,OBJPROP_FILL,true);
   ObjectSetInteger(0,objName,OBJPROP_BACK,true);
   
   ChartRedraw(0);
}

The "createRect()" function paints a solid blue rectangle:

• "ChartGetDouble()": Fetches the chart’s maximum ("CHART_PRICE_MAX", "chartPriceMax") and minimum ("CHART_PRICE_MIN", "chartPriceMin") prices, defining the vertical range.

• "ChartGetInteger()": Gets the first visible bar index ("CHART_FIRST_VISIBLE_BAR") and visible bar count ("CHART_VISIBLE_BARS"), calculating the last bar ("barsChart").

• "iTime()": Retrieves timestamps for the first ("timeFirstVisibleBar") and last ("time2") visible bars, setting the horizontal range.

• "ObjectFind()": Checks if "objName" (“RECT”) exists, returning <0 if not, preventing duplicates.

• "ObjectCreate()": Creates a rectangle ("OBJ_RECTANGLE") from ("timeFirstVisibleBar", "chartPriceMax") to ("time2", "chartPriceMin"), logging with "Print()".

• "ObjectSetInteger()", "ObjectSetDouble()": Set rectangle properties: times, prices, color ("OBJPROP_COLOR", blue RGB: 0,0,255), filled ("OBJPROP_FILL"), background ("OBJPROP_BACK").

• "ChartRedraw()": Refreshes the chart, like unveiling the base layer.

This brushes on a solid blue backdrop, like a base coat on the canvas.

Layering the Gradient: createRect_A Function

With the base layer set, we layer 100 rectangles to create a vibrant gradient, the true masterpiece.

void createRect_A(){
   string objName = "RECT_A";
   
   double chartPriceMax = ChartGetDouble(0,CHART_PRICE_MAX);
   double chartPriceMin = ChartGetDouble(0,CHART_PRICE_MIN);
   
   datetime timeFirstVisibleBar = iTime(_Symbol,_Period,(int)ChartGetInteger(0,CHART_FIRST_VISIBLE_BAR));
   int barsChart = (int)ChartGetInteger(0,CHART_FIRST_VISIBLE_BAR) - (int)ChartGetInteger(0,CHART_VISIBLE_BARS);
   if (barsChart < 0) barsChart = 0;
   
   datetime time2 = iTime(_Symbol,_Period,barsChart);
   
   int sectionsTotal = 100;
   for (int i = 1; i <= sectionsTotal; i++){
      if (ObjectFind(0,objName+IntegerToString(i)) < 0){
         ObjectCreate(0,objName+IntegerToString(i),OBJ_RECTANGLE,0,timeFirstVisibleBar,chartPriceMax-(chartPriceMax-chartPriceMin)/sectionsTotal*(i-1),time2,chartPriceMax-(chartPriceMax-chartPriceMin)/sectionsTotal*(i));
         Print("CREATED RECTANGLE A");
      }
      ObjectSetInteger(0,objName+IntegerToString(i),OBJPROP_TIME,0,timeFirstVisibleBar);
      ObjectSetDouble(0,objName+IntegerToString(i),OBJPROP_PRICE,0,chartPriceMax-(chartPriceMax-chartPriceMin)/sectionsTotal*(i-1));
      ObjectSetInteger(0,objName+IntegerToString(i),OBJPROP_TIME,1,time2);
      ObjectSetDouble(0,objName+IntegerToString(i),OBJPROP_PRICE,1,chartPriceMax-(chartPriceMax-chartPriceMin)/sectionsTotal*(i));
      ObjectSetInteger(0,objName+IntegerToString(i),OBJPROP_COLOR,
      trimCOLOR("000,000,000","000,000,200",sectionsTotal,i));
      ObjectSetInteger(0,objName+IntegerToString(i),OBJPROP_FILL,true);
      ObjectSetInteger(0,objName+IntegerToString(i),OBJPROP_BACK,true);
   }
   ChartRedraw(0);
}

The "createRect_A()" function layers the gradient:

• Setup: Uses "ChartGetDouble()", "ChartGetInteger()", "iTime()" to define the same price and time range as "createRect()".

• Loop: Iterates 100 times ("sectionsTotal"), creating rectangles named "RECT_A1" to "RECT_A100" using "IntegerToString()".

• Rectangle Sizing: Each rectangle spans a fraction of the price range ((chartPriceMax-chartPriceMin)/sectionsTotal), stacked vertically from top ("chartPriceMax") to bottom.

• "ObjectCreate()": Creates each rectangle, logging with "Print()".

• "ObjectSetInteger()", "ObjectSetDouble()": Set times, prices, filled, and background properties.

• "trimCOLOR()": Calculates a gradient color for each rectangle, transitioning from black to blue.

• "ChartRedraw()": Refreshes the chart, like unveiling the gradient.

This layers vibrant strokes, creating a black-to-blue gradient across the canvas.

Mixing the Colors: trimCOLOR Function

To complete the masterpiece, we mix colors for the gradient, blending from black to blue.

int trimCOLOR(string ARGB_1,string ARGB_2,int sections,int s_index){
   int RED=0,GREEN=0,BLUE=0;
   
   int trim_1R = (int)StringToInteger(StringSubstr(ARGB_1,0,3));
   int trim_1G = (int)StringToInteger(StringSubstr(ARGB_1,4,3));
   int trim_1B = (int)StringToInteger(StringSubstr(ARGB_1,8,3));

   int trim_2R = (int)StringToInteger(StringSubstr(ARGB_2,0,3));
   int trim_2G = (int)StringToInteger(StringSubstr(ARGB_2,4,3));
   int trim_2B = (int)StringToInteger(StringSubstr(ARGB_2,8,3));
   
   if(trim_1R > trim_2R) RED = trim_1R + (trim_2R-trim_1R)/sections*s_index;
   if(trim_1R < trim_2R) RED = trim_1R - (trim_1R-trim_2R)/sections*s_index;

   if(trim_1G > trim_2G) GREEN = trim_1G + (trim_2G-trim_1G)/sections*s_index;
   if(trim_1G < trim_2G) GREEN = trim_1G - (trim_1G-trim_2G)/sections*s_index;

   if(trim_1B > trim_2B) BLUE = trim_1B + (trim_2B-trim_1B)/sections*s_index;
   if(trim_1B < trim_2B) BLUE = trim_1B - (trim_1B-trim_2B)/sections*s_index;
   
   GREEN *= 256;
   BLUE <<= 16;
   
   return (RED+GREEN+BLUE);
}

The "trimCOLOR()" function blends colors:

• Inputs: "ARGB_1" (black: “000,000,000”), "ARGB_2" (blue: “000,000,200”), "sections" (100), "s_index" (rectangle index).

• "StringToInteger()", "StringSubstr()": Parse RGB components from strings (e.g., red from “000”).

• Interpolation: Calculates RGB values by linearly interpolating between "ARGB_1" and "ARGB_2" based on "s_index", creating a smooth gradient.

• Color Encoding: Shifts green (*256) and blue (<<16) to combine into a single integer for "OBJPROP_COLOR".

This mixes the palette, creating a gradient that brings the canvas to life. See below.

Putting It All Together

To paint with this EA:

1. Open MetaEditor in MetaTrader 5.

2. Paste the code into a new Expert Advisor file.

3. Compile (F5). If errors appear, check your copy-paste.

4. Drag the EA onto your chart, enable AutoTrading, and watch the gradient appear.

5. Enhance your analysis—pair with trading EAs or manual strategies for action.

Conclusion

The COLOR MIXTURE EA is your artist, painting a vibrant black-to-blue gradient across your chart to enhance visual analysis. We’ve brushed through its MQL5 code with clear, detailed explanations, so you understand every stroke like a master painter. Now you’re set to transform your charts into art. Want to see it in action? Check our video guide on the website!

Disclaimer: This EA is visual only and doesn’t trade. Test compatibility before use.