ResponsiveImage

The responsive rendition of one image: a candidate set per format, plus the intrinsic size of its largest rung.

width and height describe the ceiling rung rather than the original upload, so a layout can reserve the correct aspect ratio before any image bytes arrive.

Import from @homepages/template-kit.

Signature

export interface ResponsiveImage {
    sources: ResponsiveSource[];
    width: number;
    height: number;
}

Constraints

• sources is ordered by preference and a browser takes the first entry whose type it supports, so reordering it changes which format readers actually receive.

See also

• ResponsiveSource