# Split Background Colour

**URL:** <https://discourse.processing.org/t/split-background-colour/9251>\
**Category:** Coding Questions\
**Created:** [March 12, 2019, 11:38pm UTC](https://discourse.processing.org/t/split-background-colour/9251 "2019-03-12T23:38:26Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![mayathebee](https://avatars.discourse-cdn.com/v4/letter/m/b9e5f3/32.png) [@mayathebee](https://discourse.processing.org/u/mayathebee)\
**Post date:** [March 12, 2019, 11:38pm UTC](https://discourse.processing.org/t/split-background-colour/9251/1 "2019-03-12T23:38:26Z")

</div>

Hello, I am very new to processing, but I have an assignment that requires me to split the screen with blue on top and green on the bottom. I know it’s very basic, but I can’t find anything about it in the processing reference or in the forum. I would really appreciate some help!

Thank you!

---

<div class="post-metadata">

**Author:** ![GoToLoop](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/gotoloop/32/86_2.png) [@GoToLoop](https://discourse.processing.org/u/GoToLoop)\
**Post date:** [March 12, 2019, 11:49pm UTC](https://discourse.processing.org/t/split-background-colour/9251/2 "2019-03-12T23:49:22Z")

</div>

Make **background()** green and draw a blue **fill()** **rect()** at the top w/ half _height_. 🔲

---

<div class="post-metadata">

**Author:** ![mayathebee](https://avatars.discourse-cdn.com/v4/letter/m/b9e5f3/32.png) [@mayathebee](https://discourse.processing.org/u/mayathebee)\
**Post date:** [March 12, 2019, 11:58pm UTC](https://discourse.processing.org/t/split-background-colour/9251/3 "2019-03-12T23:58:00Z")

</div>

thank you so much! 😁

---

<div class="post-metadata">

**Author:** ![jeremydouglass](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/jeremydouglass/32/20_2.png) [@jeremydouglass](https://discourse.processing.org/u/jeremydouglass)\
**Post date:** [March 13, 2019, 12:01am UTC](https://discourse.processing.org/t/split-background-colour/9251/4 "2019-03-13T00:01:08Z")

</div>

You may also need to use `noStroke()` to eliminate outlines.

After mastering it with `background()`, you may also want to move to using two `rect()` calls with different `fill()`. This is the next step before putting those rects in a loop, so that you can have 2, 3, or 4 bands of color on the screen.

---

<div class="post-metadata">

**Author:** ![GoToLoop](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/gotoloop/32/86_2.png) [@GoToLoop](https://discourse.processing.org/u/GoToLoop)\
**Post date:** [March 13, 2019, 12:03am UTC](https://discourse.processing.org/t/split-background-colour/9251/5 "2019-03-13T00:03:55Z")

</div>

> [@jeremydouglass](#):
>
> … so that you can have 2, 3, or 4 bands of color on the screen.

[Studio.ProcessingTogether.com/sp/pad/export/ro.9PDcp7xMBknWz](http://Studio.ProcessingTogether.com/sp/pad/export/ro.9PDcp7xMBknWz)

---

<div class="post-metadata">

**Author:** ![nicholasmatt](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/nicholasmatt/32/16629_2.png) [@nicholasmatt](https://discourse.processing.org/u/nicholasmatt)\
**Post date:** [July 11, 2022, 10:25am UTC](https://discourse.processing.org/t/split-background-colour/9251/6 "2022-07-11T10:25:59Z")

</div>

I am trying to add a RGB color mode in full screen like this website - [https://whitescreentest.com](https://whitescreentest.com). Normally screen is white, after click it turns red, then green, then blue on every successive click. Can anyone help me implementing this.

---

<div class="post-metadata">

**Author:** ![svan](https://avatars.discourse-cdn.com/v4/letter/s/82dd89/32.png) [@svan](https://discourse.processing.org/u/svan)\
**Post date:** [July 11, 2022, 4:58pm UTC](https://discourse.processing.org/t/split-background-colour/9251/7 "2022-07-11T16:58:55Z")

</div>

Here’s one way (not sure how you’re going to get out of the fullscreen):

```auto
int counter = 0;

color WHITE = color(255, 255, 255);
color RED = color(255, 0, 0);
color BLUE = color(0, 0, 255);
color GREEN = color(0, 255, 0);

void setup() {
  fullScreen();
}

void draw() {
 switch(counter){
   case 0: background(WHITE);
   break;
   case 1: background(RED);
   break;
   case 2: background(BLUE);
   break;
   case 3: background(GREEN);
   break;
 }
  
}

void mousePressed(){
  counter++;
  if(counter > 3){
    counter = 0;
  }
}

```