# Add a "mask"/ "image" on top of these to work with a kind of cut out moving circle

**URL:** <https://discourse.processing.org/t/add-a-mask-image-on-top-of-these-to-work-with-a-kind-of-cut-out-moving-circle/39928>\
**Category:** Libraries\
**Tags:** homework\
**Created:** [November 29, 2022, 7:47am UTC](https://discourse.processing.org/t/add-a-mask-image-on-top-of-these-to-work-with-a-kind-of-cut-out-moving-circle/39928 "2022-11-29T07:47:44Z")\
**Posts on this page:** 1\
**Showing post:** 6

<div class="post-metadata">

**Author:** ![vrtx](https://avatars.discourse-cdn.com/v4/letter/v/e99b99/32.png) [@vrtx](https://discourse.processing.org/u/vrtx)\
**Post date:** [December 1, 2022, 4:01pm UTC](https://discourse.processing.org/t/add-a-mask-image-on-top-of-these-to-work-with-a-kind-of-cut-out-moving-circle/39928/6 "2022-12-01T16:01:41Z")

</div>

ok guys, i found what i am looking for. Here in this forum…  
Strugling to add this, on my project…

Here is what i found;

[https://discourse.processing.org/t/first-project-moving-a-transparent-circle-over-a-semi-opaque-background-with-an-image-behind/1078/3](https://discourse.processing.org/t/first-project-moving-a-transparent-circle-over-a-semi-opaque-background-with-an-image-behind/1078/3)

```auto
PImage img, img2;
PGraphics msk;

void setup() {
  size(600, 600);
  msk = createGraphics(width, height);
  background(100, 0, 0);
  noStroke();
  for ( int t = 0; t < 100; t++) {
    fill(random(200), random(200), random(200));
    rect( random(width-20), random(height-20), 20, 20);
  }
  img = get();
}

void draw() {
  msk.beginDraw();
  msk.background(0);
  msk.fill(255);
  msk.ellipse(mouseX, mouseY, 80, 80);
  msk.endDraw();
  background(img);
  img2 = get();
  filter(BLUR, 7);
  img2.mask(msk);
  image( img2, 0, 0);
  noFill();
  stroke(0);
  ellipse(mouseX, mouseY, 80, 80);
}

```

Now the focus is how to join them, like, what i have to take off from one and other leaving the basics, the fundamental things/ideias of my on project/sketch there.  
I am almos there!!!  
Take a look on my last skecth above… Seems it is easy, like, only make the circle transparent to show whats is behind.  
But i seeing the last example i got totally confused… …  
Keeping on!!!

---

_[View the full topic](https://discourse.processing.org/t/add-a-mask-image-on-top-of-these-to-work-with-a-kind-of-cut-out-moving-circle/39928)._