Smart Crosshair

Hello Guys,

I’m working on an First Person Shooter and I was searching how to make a smart crosshair and I didn’t found anything, I explain (what is my definition of smart crosshair) :

  1. That become bigger when you shoot(not to much, just a touch)
  2. Depending where you focus is size change

And it is basically this. I finally want how you can make it : with a script, raycast… And maybe some explanation or the final script (if is the good way to make it).

Best Regards,

A basic crosshair that spreads.

//Slap this script on to the main camera or similar and you’ll have a GUI driven crosshair

#pragma strict
var drawCrosshair = true;
var crosshairColor = Color.white;   //The crosshair color
var width : float = 3;      //Crosshair width
var height : float = 35;     //Crosshair height
class spreading{
    var spread = 20.0;          //Adjust this for a bigger or smaller crosshair
    var maxSpread = 60.0;
    var minSpread = 20.0;
    var spreadPerSecond = 30.0;
    var decreasePerSecond = 25.0;

var spread : spreading;
private var tex : Texture2D;
private var lineStyle : GUIStyle;
function Awake (){
    tex = Texture2D(1,1);

    SetColor(tex, crosshairColor); //Set color

    lineStyle = GUIStyle();
    lineStyle.normal.background = tex;

function Update (){
        spread.spread += spread.spreadPerSecond * Time.deltaTime;       //Incremente the spread
        spread.spread -= spread.decreasePerSecond * Time.deltaTime;      //Decrement the spread    	
    spread.spread = Mathf.Clamp(spread.spread, spread.minSpread, spread.maxSpread);  
function OnGUI (){
    var centerPoint = Vector2(Screen.width / 2, Screen.height / 2);
        GUI.Box(Rect(centerPoint.x - width / 2, centerPoint.y - (height + spread.spread), width, height), "", lineStyle);
        GUI.Box(Rect(centerPoint.x - width / 2, centerPoint.y + spread.spread, width, height), "", lineStyle);
        GUI.Box(Rect(centerPoint.x + spread.spread, (centerPoint.y - width / 2), height , width), "", lineStyle);
        GUI.Box(Rect(centerPoint.x - (height + spread.spread), (centerPoint.y - width / 2), height , width), "", lineStyle);

function Fire(){
    //Carry out your normal shooting and stuff

    //Applies color to the crosshair
function SetColor(myTexture : Texture2D, myColor : Color){
    for (var y : int = 0; y < myTexture.height; ++y){
        for (var x : int = 0; x < myTexture.width; ++x){
            myTexture.SetPixel(x, y, myColor);

I spend a little bit of time on this and I managed to create the script above. The script is rather basic and there is a lot that you can do with it, but I guess it will do, for now at least.

Here is my solution for your question:

  1. use Screen.showCusor = false to hide mouseCousor
  2. use GUI.DrawTexture for your crossHair
  3. if shoote, replace one bigger texture when press fire button,you can adjust the size by GUI.DrawTexture function.
  4. use Raycast to gernerate one ray from fire position and if it is hit something with tag,for example “Enemy”, replace the texture that belongs to “Enemy”(you need assign tag “Enemy” to your Enemy object.)

You can always have 2 images of a crosshair, one normal and one spread out. use Gameobject.SetActive while moving/shooting etc. I’m doing it in my games at least.

i dont know how to make that kind of crosshairs but what you can do is add the cross hairs in the game there is a crosshairs script in the game and the texture is the aim one i hope that helps