# How to code this shape?

**URL:** <https://discourse.processing.org/t/how-to-code-this-shape/8882>\
**Category:** Coding Questions\
**Created:** [March 3, 2019, 8:25am UTC](https://discourse.processing.org/t/how-to-code-this-shape/8882 "2019-03-03T08:25:38Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![Vennila](https://avatars.discourse-cdn.com/v4/letter/v/c57346/32.png) [@Vennila](https://discourse.processing.org/u/Vennila)\
**Post date:** [March 3, 2019, 8:25am UTC](https://discourse.processing.org/t/how-to-code-this-shape/8882/1 "2019-03-03T08:25:38Z")

</div>

Hi,  
I’m practicing a sketch on p5.js. I have attached below a small cropped portion of the complete image. I want to draw the highlighted image. If I use ellipse function, it fills color on the inside portion of the ellipse. Rather I want it on the outer region. I don’t want to use the background() function, as the complete picture is different. Is there any other way to code this?

Thank you for your time 🙂  
 ![Capture](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/5/520327aac0059ee418de8de42441b0cf0018a722.png)

---

<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 7, 2019, 5:07pm UTC](https://discourse.processing.org/t/how-to-code-this-shape/8882/2 "2019-03-07T17:07:23Z")

</div>

Two ways to approach this problem:

1. draw your region with curves:  
[https://p5js.org/learn/curves.html](https://p5js.org/learn/curves.html)
2. subract from area you want with an ellipse using a mask:  
[https://p5js.org/reference/#/p5.Image/mask](https://p5js.org/reference/#/p5.Image/mask)  
[https://p5js.org/examples/image-alpha-mask.html](https://p5js.org/examples/image-alpha-mask.html)
