Related services: MediaHelperService — lynkow.mediaHelper.srcset(), lynkow.mediaHelper.transform()

ImageVariants

Interface

CDN image variant URLs generated by the Lynkow image transformation service.

Each property is a pre-generated URL for a specific size/crop preset. All URLs are served through the Lynkow CDN and support WebP/AVIF auto-negotiation via the Accept header. A property is undefined only when the endpoint returning this object excludes that preset from its response (e.g. category images omit medium/content). For featured images on content and pages, the six variants thumbnail, card, medium, content, hero, and og are always present. The CDN uses a scale-down fit that preserves the original size when the source image is smaller than the target preset, so every URL is safe to use in src or srcset regardless of the source dimensions.

Use the smallest variant that fits your layout to minimize bandwidth.

Property

Type

Optional

Description

avatar

string

Yes

128x128px, cover crop with face detection gravity.<br>Use case: user avatars, author photos, profile pictures.<br>Face detection ensures faces are centered in the crop.

card

string

Yes

600px wide, scaled down proportionally (no crop). The source aspect<br>ratio is preserved, so a portrait source returns a portrait variant.<br>Compose with aspect-ratio and object-fit CSS to constrain the<br>display ratio in your layout.<br>Use case: card layouts, blog post previews, medium-sized list items.

content

string

Yes

1200px wide, scaled down proportionally (no crop).<br>Use case: inline images within article body content.<br>Serves the source at its native size when the original is narrower than 1200px.

full

string

Yes

2560px wide, scaled down proportionally (no crop).<br>Use case: full-resolution display, lightbox/zoom views, retina hero images.<br>This is the largest available variant. Serves the source at its native size<br>when the original is narrower than 2560px.

hero

string

Yes

1920px wide, scaled down proportionally (no crop).<br>Use case: full-width hero banners, page headers, background images.<br>Serves the source at its native size when the original is narrower than 1920px.

medium

string

Yes

960px wide, scaled down proportionally (no crop).<br>Use case: medium-width displays, sidebar featured images, tablet layouts.<br>Serves the source at its native size when the original is narrower than 960px.

og

string

Yes

1200x630px, cover crop.<br>Use case: Open Graph images, social media sharing (Facebook, LinkedIn, Twitter).<br>Dimensions follow the recommended OG image ratio (1.91:1).

thumbnail

string

Yes

400px wide, scaled down proportionally (no crop), with sharpening.<br>The source aspect ratio is preserved, so a portrait source returns a<br>portrait variant. Compose with aspect-ratio and object-fit CSS to<br>constrain the display ratio in your layout.<br>Use case: list views, grid thumbnails, small cards.

SrcsetOptions

Interface

Options for building srcset URLs

Property

Type

Optional

Description

fit

"cover" | "contain" | "scale-down" | "crop"

Yes

Resize fit mode. 'scale-down' (default) preserves aspect ratio and<br>never upscales; 'cover' fills the box and crops; 'contain' fits<br>inside the box with letterboxing; 'crop' hard crops to the exact<br>dimensions. Must pair with gravity for 'cover' / 'crop' when<br>the subject is not centered.

gravity

string

Yes

Focal point for fit: 'cover' | 'crop' as an XxY pair of<br>fractions (e.g. '0.5x0.3' keeps the horizontal center but biases<br>towards the upper third). Omit to center the crop.

quality

number

Yes

JPEG / WebP quality on a 1-100 scale. Higher values produce larger<br>files. Default 80 strikes a good balance for photography; drop to<br>60-70 for hero images on slow connections.

widths

number[]

Yes

Pixel widths to generate in the srcset, in ascending order. Each<br>width becomes a Nw entry in the returned string. Defaults to<br>[400, 800, 1200, 1920] to cover phone, tablet, desktop, large<br>desktop. Supply a custom list when you know your layout's<br>breakpoints to avoid bandwidth waste.

TransformOptions

Interface

Options for building a single transformed URL. Each field maps to a query parameter understood by the Lynkow image transformation service; omit any value to let the CDN choose a sensible default.

Property

Type

Optional

Description

dpr

number

Yes

Device Pixel Ratio multiplier on a 1-4 scale. Multiplies the<br>rendered width/height so a 400px box renders sharp at 2x on<br>Retina. Prefer using a srcset over a hard-coded DPR.

fit

"cover" | "contain" | "scale-down" | "crop"

Yes

Resize fit mode. See SrcsetOptions.fit for semantics; the<br>default here is 'scale-down' to avoid accidental upscaling.

format

"auto" | "webp" | "avif" | "jpeg"

Yes

Output image format. 'auto' (default) lets the CDN negotiate<br>based on Accept (WebP on modern browsers, AVIF on the newest).<br>Force a specific format only when the consumer is known.

gravity

string

Yes

Focal point for fit: 'cover' | 'crop' as an XxY pair of<br>fractions (see SrcsetOptions.gravity). Omit to center.

h

number

Yes

Target height in pixels. When set alone, width is derived from the<br>image's aspect ratio (unless fit requires both).

quality

number

Yes

Image quality 1-100 (default: 80)

w

number

Yes

Target width in pixels. When set alone, height is derived from the<br>image's aspect ratio (unless fit requires both).