Creative Asset Specifications

Pixel dimensions and the image grid

A raster image stores visual information on a pixel grid. Pixel dimensions state its width and height: a hypothetical 2400 × 1600 image has 2400 columns and 1600 rows. Multiplying those dimensions gives 3,840,000 pixels. That count describes the grid, not the compressed file size or the number of distinct details visible in the scene. Adobe distinguishes pixel dimensions from physical size and resolution. Adobe: Image size, resolution, and resampling

A megapixel is one million pixels, so the hypothetical image contains 3.84 megapixels. Two images with that count may have different shapes because the same product can come from different width-height pairs. Enlarging a raster also does not establish that additional original detail existed in the source. Pixel count is therefore a measurement of the representation, not a certificate of sharpness, focus, faithful colour, or accurate subject matter.

Resolution, physical size, and resampling

Print resolution describes how many image pixels are assigned to a physical length, commonly pixels per inch, or PPI. For a hypothetical 2400-pixel width printed at 300 PPI, the resulting width is eight inches. At 150 PPI, the same pixels span sixteen inches. These are arithmetic examples, not universal print requirements. Adobe explains the relationship between pixel dimensions, physical size, and resolution in Photoshop. Adobe: Image size, resolution, and resampling

With resampling disabled, changing resolution changes the assigned physical size without changing the pixel count. With resampling enabled, software can add or remove pixels. Upsampling creates additional pixel values through the selected interpolation process; downsampling reduces the grid. Thus changing a file’s PPI metadata and resampling its pixels are different operations. For screen display, Adobe identifies pixel dimensions, rather than the print-resolution setting, as the relevant image-size measure. Adobe: Image size, resolution, and resampling

Aspect ratio, cropping, and resizing

Aspect ratio expresses width relative to height. A hypothetical 2400 × 1600 image reduces to 3:2 because both numbers divide by 800. A 1200 × 800 image has the same ratio despite containing fewer pixels. A square has a 1:1 ratio. The ratio alone does not state the pixel count, physical print size, file format, or compressed byte size of the asset.

Proportional resizing preserves that width-height relationship. Cropping changes which part of the picture remains visible and can change its ratio. Stretching width independently from height changes proportions rather than simply showing a different crop. MDN distinguishes responsive resolution switching from art direction: resolution switching provides differently sized image sources, while art direction can provide different crops for different layouts. These are separate delivery concepts even when they concern the same subject. MDN: Responsive images

Transparency and alpha information

Transparency describes how an image contributes to the background behind it. Alpha information can represent fully transparent, partially transparent, and opaque areas where the format supports it. MDN documents alpha support in formats including PNG and WebP. A transparent margin remains part of the image’s pixel dimensions even though the background can show through it; transparency does not automatically trim the canvas. MDN: Image file type and format guide

Formats differ in how they represent transparency. MDN describes GIF as supporting a transparent palette entry, while PNG supports alpha transparency and JPEG does not support an alpha channel. A checkerboard visible inside an image editor is typically an interface representation of transparency, not proof that a final exported file retains it. File-format support and the actual encoding of a particular file are distinct facts. MDN: Image file type and format guide

Lossy and lossless compression

Compression encodes image information into a smaller representation. Lossless compression permits reconstruction of the encoded image data without the information loss characteristic of lossy compression. Lossy encoding discards information according to the codec and settings. MDN documents JPEG as lossy and PNG as lossless; WebP supports both modes. The format name therefore does not always identify a single compression behaviour. MDN: Image file type and format guide

Compressed byte size depends on more than pixel dimensions: the image content, format, and encoding settings also matter. Two equally sized pixel grids need not produce equal-sized files. Re-encoding a previously lossy image into a lossless format does not restore discarded source information; it preserves the image data supplied to that new encoding. Likewise, a quality setting is an encoder control, not a universal percentage of visual truth shared by every codec. MDN: Image file type and format guide

Raster formats and vector graphics

JPEG stores raster imagery with lossy compression and no alpha transparency. PNG is a lossless raster format with transparency support. GIF uses indexed colour and supports animation; its palette-based representation differs from full-colour formats. WebP supports lossy and lossless coding, transparency, and animation. AVIF uses AV1-based image coding and also supports transparency. These characteristics describe format capabilities, not a guarantee that a particular file uses every capability. MDN: Image file type and format guide

SVG differs because it describes vector graphics using XML-based markup rather than necessarily storing a fixed pixel grid. Shapes and paths can be rendered at different display sizes, although an SVG can also include embedded raster imagery. A vector container therefore does not prove that all content inside it is resolution-independent. Converting a photograph into an SVG container alone does not turn its sampled pixels into geometric paths. MDN: Image file type and format guide

File properties and web display requirements

An image’s intrinsic dimensions and its displayed size are separate. MDN explains responsive images through source candidates, srcset, sizes, and the picture element. Browsers can choose among sources for different display conditions. A displayed width in a page layout is therefore not necessarily the pixel width of the downloaded source, particularly on high-density screens. Responsive delivery does not change the definition of the underlying file’s pixel grid. MDN: Responsive images

A hypothetical asset record might state width, height, aspect ratio, format, alpha presence, and byte size as separate fields. None substitutes for the others. A platform’s accepted formats or upload constraints belong to that platform’s current documentation; this guide does not assert a cross-platform upload limit. The production operation is a different subject, covered by AI Image Generation Methods. Generating a picture and describing its exported technical properties answer different questions. MDN: Image file type and format guide

Frequently asked questions