UI Image

You can create a new UI Image object using Create | UI | Image:

The UI Image object contains the Rect Transform and Canvas Renderer components as well as the Image component.

Image component

The first setting on the Image component is the Source Image property, which represents the sprite that will be rendered. The Color property represents the base color of the sprite being rendered. Leaving the color at white will make the image appear exactly as the sprite, but changing the color will add a tinted color overlay to the image. You can also change the transparency of the image by reducing the alpha value. The Material property allows you to add a material to the image. The Raycast Target property works the same way as it does on the Text component, by specifying whether the image will block clicks on UI objects behind it or not.

Note

Chapter 5 contains an example that demonstrates how to swap the Source Image via code.

When a sprite is assigned to the Source Image slot, new options appear...