Is it possible to resize an image/texture not by scaling, but by adding transparent border?

[canadaduane]

I’m interested in this neat technique that allows you to create an outline around an image:

How to create a simple outline around a PNG sprite?

I’ve implemented the code according to the following two (Unity) resources. Dev Diary - Research Report: 2D Sprite Outline Shaders Writing Shaders In Unity - 2D Sprite Outline - Beginner Tutorial Well, it was important to me to work with references^^. And since both explained the topic quite well, I decided to start with an inset outline. It seems drawing the outline around the sprite requires a different type of shader. I’ve not yet found a proper resource for that though. This is why I la…

However, if the image does not have enough space for the outline, the outline will be cropped. Is there a way to “add extra border space” around an image texture?

Pixel art apps usually call this changing the “canvas size” of an image, rather than “scaling” the image.

[looeee]

@canadaduane

Is there a way to “add extra border space” around an image texture?

Presumably you could just add some extra transparent pixels are the edges of the image, or shrink down the artwork a bit?

[canadaduane]

Yes, that’s certainly possible when I control the artwork. But in the game we’re building (https://relm.us) users can upload content. I could potentially process it on the server, but I was wondering if there’s a way to do it in JS on the client side.

[rrrr_rrrr]

@canadaduane

I was wondering if there’s a way to do it in JS on the client side.

Img_border.html (1011 Bytes)

[canadaduane]

Thanks! That will do the trick.