Crosshair outline color

Hello

I am back with just a quick question :slight_smile:. I have created a crosshair like below:

11

12

What I want to know is there anyway to add a secondary (outline) colour to the 4 crosshair reticles I have? Like for example if you look at a white object the crosshair main colour blends into the white making it not visible.

Hi @nasjarta! I think the easiest way is to use a crosshairs image that has already an outline. I found a couple of them on the web. You could also use square images with on top a smaller square image. And if that’s not working for you then you could use the letter ‘l’ because you can add outline on font. :sunglasses:

1 Like

Hi @nasjarta,

If you don’t want to have 2 separate images for your crosshair (with with outline and one without) You could consider searching for or creating an SVG of your crosshair and using IcoMoon to create a font file with it.

https://icomoon.io/

That way you could dynamically control the size and color of the outline on the same element.

1 Like

@Albertos Nice alternatives, I will be sure to try all.

@eproasim So for what I understand you can use that app to create a font file from a SVG then use that font file in playcanvas as the crosshair, and since its a font then you have the option of adding an outline like Albertos suggested.

1 Like

Hi @nasjarta,

That’s right!

2 Likes

Thanks!

Random question: If I wanted to animate my crosshair and make it dynamic would it be better to do it with 4 separate reticles or just 1? Or does it not matter.

Hi @nasjarta,

Sorry for the delay. I suppose the answer depends on what you mean by making the the crosshair dynamic.

If you mean a reticle spread, like in most shooter games during fire, I would say you have 4 separate elements that can be moved in/out.

2 Likes