# Is it possible to erase part of an object and let the background show through?

**URL:** <https://discourse.processing.org/t/is-it-possible-to-erase-part-of-an-object-and-let-the-background-show-through/29331>\
**Category:** Beginners\
**Created:** [April 13, 2021, 1:41pm UTC](https://discourse.processing.org/t/is-it-possible-to-erase-part-of-an-object-and-let-the-background-show-through/29331 "2021-04-13T13:41:58Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![cottonchipper](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/cottonchipper/32/10594_2.png) [@cottonchipper](https://discourse.processing.org/u/cottonchipper)\
**Post date:** [April 13, 2021, 1:41pm UTC](https://discourse.processing.org/t/is-it-possible-to-erase-part-of-an-object-and-let-the-background-show-through/29331/1 "2021-04-13T13:41:58Z")

</div>

Is it possible to erase part of an object such as a rectangle or ellipse and allow the background color to show through? In the example I’ve got the background set to a gradient and am attempting to erase two rectangles from a red ellipse. The “erase()” function apparently erases everything, including the background color.

```auto
let c1,c2;

function setup() {
createCanvas(windowWidth, windowHeight);
  c1 = color(255);
  c2 = color(63, 191, 191);
  
  for(let y=0; y<height; y++){
    n = map(y,0,height,0,1);
    let newc = lerpColor(c1,c2,n);
    stroke(newc);
    line(0,y,width, y);
  }
  
}

function draw() {
 fill(255, 0, 0);
ellipse(150,150,200,200);
erase();
rect(160,160,20,20);
rect(180,180,50,50);
noErase();
}

```

---

<div class="post-metadata">

**Author:** ![micuat](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/micuat/32/19407_2.png) [@micuat](https://discourse.processing.org/u/micuat)\
**Post date:** [April 13, 2021, 2:37pm UTC](https://discourse.processing.org/t/is-it-possible-to-erase-part-of-an-object-and-let-the-background-show-through/29331/2 "2021-04-13T14:37:34Z")

</div>

Hi! As you said `erase` erases even the background (there is no sense of layers in canvas). So you need to `createGraphics` to make them into separate layers  
[https://editor.p5js.org/micuat/sketches/gpPX-gmav](https://editor.p5js.org/micuat/sketches/gpPX-gmav)

---

<div class="post-metadata">

**Author:** ![cottonchipper](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/cottonchipper/32/10594_2.png) [@cottonchipper](https://discourse.processing.org/u/cottonchipper)\
**Post date:** [April 13, 2021, 4:51pm UTC](https://discourse.processing.org/t/is-it-possible-to-erase-part-of-an-object-and-let-the-background-show-through/29331/3 "2021-04-13T16:51:37Z")

</div>

Awesome! Thank you so much!
