Sprite

Updated: 08/02/2020 by Computer Hope

A sprite may refer to any of the following:

Sprite consisting of twelve computer-related icons.

1. With a web page, a sprite is a single image comprised of several images. The picture shows a Computer Hope sprite with 12 images used throughout the website. Using sprites on a web page, load times are improved, and server stress is reduced. In the example, because the twelve images are contained in the sprite, your browser only makes one request to the server instead of twelve.

Below is an example of a CSS (cascading style sheets) class used to show the print page icon on Computer Hope. Each image in the sprite loads the same way, but the location of the image changes.

.print{background:url(https://www.computerhope.com/cdn/sprite.png) no-repeat -10px -302px

Although a sprite can be done manually, users new to sprites or who don't want to learn how to make sprites can use a sprite generator, such as Spritegen.com.

2. A graphic image or animated graphic image that can be moved independently with a mouse cursor or keyboard commands. An example of a sprite is the computer mouse cursor.

Aseprite, CSS, Graphic, Icon, Web design terms