Changing colours

hii,i want to change the colour of square with respect to change in the size of the square .i want dark colour in the centre and light colour on the edges. here is my code can anybody tell me what should i do?

int squareSize=6;
final float DIFF_SIZE=1;
final int MIN_COLOUR=1;
final int MAX_COLOUR=10;
final float INIT_RED=100,INIT_GREEN=50,INIT_BLUE=80;
final float FINAL_RED=255,FINAL_GREEN=200,FINAL_BLUE=250;
final float MAX_SIZE=40;
final float X_SPACING =10;
final float Y_SPACING=10;
 float squareX,squareY;
void setup(){
size(600,600);}


void draw()
{
 squareX=mouseX-squareSize/2;
squareY=mouseY-squareSize/2;
  background(255);

 drawRowsOfBlocks();

 }


    
  void drawOneBlock()
  {
    
   
    rect(squareX,squareY,squareSize,squareSize);
    for(int i=MIN_COLOUR; mousePressed && i <=MAX_COLOUR/10; i++)
  { float redValue=INIT_RED+(i-MIN_COLOUR)/(MAX_COLOUR-MIN_COLOUR)*(FINAL_RED-INIT_RED);
    float greenValue=INIT_GREEN+(i-MIN_COLOUR)/(MAX_COLOUR-MIN_COLOUR)*(FINAL_GREEN-INIT_GREEN);
    float blueValue=INIT_BLUE+(i-MIN_COLOUR)/(MAX_COLOUR-MIN_COLOUR)*(FINAL_BLUE-INIT_BLUE);  
    fill(redValue,greenValue,blueValue);
    rect(squareX,squareY,squareSize,squareSize);
    squareSize+=DIFF_SIZE;
  }
  if (squareSize>MAX_SIZE)
  {
    squareSize=6;}
  }
  
  void drawRowsOfBlocks()
  { drawOneBlock();
  
for (int i=1;keyPressed&& i<=2;i++)
    { drawOneBlock();
    
 float squareY2;
 squareY2=squareY+squareSize+Y_SPACING;
squareY=squareY2;
 }}

Good day karan26,

Do you mean you want to fill the square with a single, dark colour and have a light coloured edge around it? If so, stroke() (see the second example) should suffice. Or did you have something else in mind?

-a- your code is not usable, please repair the above code posting
by insert the formatted code ( IDE [Ctrl][t] )
into the

</> code tag

looks like
```
type or paste code here
```


-b- if you want to use rectangles with different fill colors
in overlay

  • use noStroke() in setup() {}
  • start with draw the biggest first!
    and the smaller ones ( with a different fill color ) over it.

-c- your use of keyPressed and mousePressed
inside FOR loops surprised me
interesting idea ++++

I want to get different colours.

It seems like you want a radial gradient with squares rather than ellipses. You can change ellipse to rect in this example:

https://processing.org/examples/radialgradient.html

It is also possible to do this with PShape, or with PShader, or with a mask. It depends on the specifics of what you are trying to accomplish.

For past discussions see: