# Displaying transparent img

**URL:** <https://discourse.processing.org/t/displaying-transparent-img/6895>\
**Category:** Coding Questions\
**Created:** [December 25, 2018, 7:47pm UTC](https://discourse.processing.org/t/displaying-transparent-img/6895 "2018-12-25T19:47:29Z")\
**Posts on this page:** 9\
**Page:** 1

<div class="post-metadata">

**Author:** ![CodeMasterX](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/codemasterx/32/2942_2.png) [@CodeMasterX](https://discourse.processing.org/u/CodeMasterX)\
**Post date:** [December 25, 2018, 7:47pm UTC](https://discourse.processing.org/t/displaying-transparent-img/6895/1 "2018-12-25T19:47:29Z")

</div>

Hi!  
Ive been working on a few games that require non rect images, but i dont have any tool to make transparent images ☹ i only have default programs of Win10, and i dont want to download some large programs.  
I am looking for a free simple-mid advanced img editor, preferably if it is allready in Win10 by default.

Thx

---

<div class="post-metadata">

**Author:** ![TfGuy44](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/tfguy44/32/41_2.png) [@TfGuy44](https://discourse.processing.org/u/TfGuy44)\
**Post date:** [December 25, 2018, 8:09pm UTC](https://discourse.processing.org/t/displaying-transparent-img/6895/2 "2018-12-25T20:09:42Z")

</div>

You don’t need a pre-made tool. You can write code now! You can make your own tool!

```auto
String filename = "yourfile.png";

size(400,400);
PImage img = loadImage( filename );
PGraphics pg = createGraphics( img.width, img.height );
pg.beginDraw();
pg.clear();
img.loadPixels();
for( int i = 0; i < img.pixels.length; i++){
  if( img.pixels[i] != color(255,0,255) ){
    pg.stroke( img.pixels[i] );
    pg.point(i%pg.width, i/pg.width);
  }
}
PImage done = pg.get();
done.save( "done.png" );
exit();

```

EDIT: This was something I just had handy - looking at its working now, I can see there’s room for improvements… Anyway, just have a bright pink background, and this will turn it transparent. Great for making, say, sprites for games.

Sample image you can try it on:  
 ![pinkbigham2](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/f/f93b0e0a6bb665eeaeaa752661791b2e72db2ed5.png)

---

<div class="post-metadata">

**Author:** ![Architector\_4](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/architector_4/32/813_2.png) [@Architector\_4](https://discourse.processing.org/u/Architector_4)\
**Post date:** [December 25, 2018, 8:11pm UTC](https://discourse.processing.org/t/displaying-transparent-img/6895/3 "2018-12-25T20:11:18Z")

</div>

As far as I know, Windows 10 doesn’t have any tools that can make transparent images by default.  
As for a small image editor that can, I suggest [Pinta](https://pinta-project.com/pintaproject/pinta/). It’s small, great, and starts up instantly, i.e. comparable to MS Paint.  
Just start it up, load your image up, select Eraser(shortcut key E), and start making holes!  
If you don’t like anti-aliasing, or its size, you can change both at the panel ontop.  
Then, save as .png file, done!

Or, you can make your own tool, like mentioned above.

---

<div class="post-metadata">

**Author:** ![CodeMasterX](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/codemasterx/32/2942_2.png) [@CodeMasterX](https://discourse.processing.org/u/CodeMasterX)\
**Post date:** [December 25, 2018, 9:32pm UTC](https://discourse.processing.org/t/displaying-transparent-img/6895/4 "2018-12-25T21:32:49Z")

</div>

Thx a lot! 🙂 but I wonder if 255,0,255 proceessing renders like transparent? And are there any online tutorials for pinta?

---

<div class="post-metadata">

**Author:** ![TfGuy44](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/tfguy44/32/41_2.png) [@TfGuy44](https://discourse.processing.org/u/TfGuy44)\
**Post date:** [December 25, 2018, 10:33pm UTC](https://discourse.processing.org/t/displaying-transparent-img/6895/5 "2018-12-25T22:33:58Z")

</div>

I think you misunderstood… The above code will take an image that has no transparency and make an image based on it that does have transparency. The pixels that you want to be transparent should be bright pink in the starting image - in the resulting image they will be completely transparent.

---

<div class="post-metadata">

**Author:** ![CodeMasterX](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/codemasterx/32/2942_2.png) [@CodeMasterX](https://discourse.processing.org/u/CodeMasterX)\
**Post date:** [December 25, 2018, 10:54pm UTC](https://discourse.processing.org/t/displaying-transparent-img/6895/6 "2018-12-25T22:54:51Z")

</div>

So processing will take any 255,0,255 and render it transparent?

---

<div class="post-metadata">

**Author:** ![TfGuy44](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/tfguy44/32/41_2.png) [@TfGuy44](https://discourse.processing.org/u/TfGuy44)\
**Post date:** [December 26, 2018, 12:25am UTC](https://discourse.processing.org/t/displaying-transparent-img/6895/7 "2018-12-26T00:25:38Z")

</div>

Yes. Of course you can pick a different color to make transparent if you like - just edit the above code. I mean, if your image has hot pink ( which is color(255,0,255), you know?) pixels in the sprite, you don’t want those to be transparent, right? The point I’m trying to make is that you have the ability to do what you want by using Processing. You actually can set pixels to transparent, yourself, via a small amount of code. You don’t need any additional tools or programs to do it.

---

<div class="post-metadata">

**Author:** ![CodeMasterX](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/codemasterx/32/2942_2.png) [@CodeMasterX](https://discourse.processing.org/u/CodeMasterX)\
**Post date:** [December 26, 2018, 7:41am UTC](https://discourse.processing.org/t/displaying-transparent-img/6895/8 "2018-12-26T07:41:33Z")

</div>

Thx a lot 🙂 sry for all the nonsence u had to go through ☹ I understand it now.  
Bye

---

<div class="post-metadata">

**Author:** ![CodeMasterX](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/codemasterx/32/2942_2.png) [@CodeMasterX](https://discourse.processing.org/u/CodeMasterX)\
**Post date:** [December 26, 2018, 1:16pm UTC](https://discourse.processing.org/t/displaying-transparent-img/6895/9 "2018-12-26T13:16:12Z")

</div>

Just tested it… AND IT WORKS 🙂
