# Custom Crosshairs

**Crosshairs** are one of those things you either love creating or you hate them. They require knowledge about Unity's *Animation* and *Animator* tools, so they are a bit advanced. If you're not comfortable using these tools, we'd advice you take a look at the [Unity Manual](https://docs.unity3d.com/Manual/AnimatorControllers.html) first.

To create a **Crosshair** you first need to create a **Canvas** object, like you would normally do for any UI element. Use Unity Image components to design your Crosshair UI. You can use whatever tools you want, but bear in mind that these elements will need to be animated later on.

![(Example of a Crosshair design with just 4 rectangular images)](https://2174264233-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LAqwYovmUPn5V6CMeID%2F-LqCNxesmxRZuo5cIgPM%2F-LqCQXkgGkZqkw-pIqGU%2Fcrosshair-example.jpg?alt=media\&token=f6300361-bcd0-4535-b0e9-7c1acf5a8006)

Once you have your **Crosshair UI** set up it's time to work on the **Animation**.

In your *Project Panel*, create a new **Animator Overrider**. This will be used to control what animation will be played when.

![(Animator Overrider called HighTechA)](https://2174264233-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LAqwYovmUPn5V6CMeID%2F-LqCNxesmxRZuo5cIgPM%2F-LqCPUUj8L7PULTlL-hh%2Fcrosshair-animator.jpg?alt=media\&token=6e0c1938-f35a-445d-b2c2-41d9c546c361)

Click on the right dot of the **Controller** and select one called **CrosshairDefault**. This **Animator** will inherit all transitions and parameters from the default one.

Now, all that's left to do is create the animations for when the Crosshair is at its maximum precision and when it's at its minimum.

Once you have these **Animation Clips** created, drag and drop them onto the **CrosshairDefaultMax** and **CrosshairDefaultMin** fields.

You can now save the prefab and exit the prefab mode. Look for your Ammo object you want to use this crosshair with and drag and drop it onto the **Crosshair** field, under the **Aiming** section.

![(Aiming section with Crosshair-HighTechA)](https://2174264233-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LAqwYovmUPn5V6CMeID%2F-LqAYGVO7tW7nAGOqK6p%2F-LqAbggZ9zIu1nBYBLZs%2Fammo-aiming-crosshair.jpg?alt=media\&token=d8bab7c0-4223-42c7-bad9-7659a2aa83f3)

That's it! You can click Play and this crosshair will be automatically used whenever aiming with this ammunition.

{% hint style="info" %}
The **Shooter** module will take care of creating and destroying the crosshair whenever it's needed as well as interpolate the animations between the ones that were created.
{% endhint %}
