A sprite may refer to any of the following:

  1. When referring to a web page, a sprite is a single image comprised of several images. The picture is an example of a Computer Hope sprite with 12 different images used throughout the Computer Hope 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 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.

  1. 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.
  • How to test and check a web page for errors.

Aseprite, CSS, Graphic, Icon, Web design terms