Represents an image control.

Typically the PictureBox is used to display graphics from a bitmap, metafile, icon, JPEG, GIF, or PNG file.

Set the Image property to the Image you want to display, either at design time or at run time. You can alternatively specify the image by setting the ImageSource property and load the image synchronously using the Load method or asynchronously using the LoadAsync method.

For a full list of properties, methods and events see the API documentation.


Size Modes

The SizeMode property of the PictureBox control manages the image placement and control sizing. It features several preset configurations:

  • AutoSize: The PictureBox is sized equal to the size of the image that it contains.

  • CenterImage: The image is displayed in the center if the PictureBox is larger than the image. If the image is larger than the PictureBox, the picture is placed in the center of the PictureBox and the outside edges are clipped.

  • Cover: The image is resized to cover the entire container, even if it has to stretch the image or cut a little bit off one of the edges.

  • Normal: The image is placed in the upper-left corner of the PictureBox. The image is clipped if it is larger than the PictureBox it is contained in.

  • Stretch: The image within the PictureBox is stretched or shrunk to fit the size of the PictureBox.

  • Zoom: The size of the image is increased or decreased maintaining the size ratio.


JavaScript Widget


Class name


Theme appearance

"picturebox", see Themes.

Source Code

Last updated