Skip to main content

Qsc Image Scaler

Url format You can convert and resize images by requesting them using in a certain way formatted URL. So you don’t need to write any code. All you need to do is only change HTML markup of your website to use the new urls. The format is:

https://domain/cdn-cgi/image/options/image-source

Descriptions of each part of the URL:

domain

Your domain name.

/cdn-cgi/image/

A fixed prefix.

options

A comma-separated list of options (for example width, height).

image-source

An absolute URL pointing to an image to resize(http and https supported). The path is not URL-encoded, can be like /cdn-cgi/image/width=100/https://example.com/somepath/someimage.png.

Here’s an example of a URL with options set to width=100,quality=85 and a image-source of https://somesite.com/someimage.png.

<img src="https.example.com/cdn-cgi/image/width=100,quality=85/https://somesite.com/someimage.png">

Options

Options are comma-separated, spaces are not allowed. At least one option must be specified.

width=x or w=x

Specifies width of the image in pixels.

height=x or h=x

Specifies height of the image in pixels.

dpr=x

Device Pixel Ratio. Equals 1 by default. Multiplier for width/height that makes it easier to specify higher-DPI sizes.

fit

Affects interpretation of width and height. All fit modes preserve aspect ratio.

  • fit=scale-down

    Image can be shrunk in size to fully fit within the given width or height, but won’t be enlarged.

  • fit=contain

    Image will be shrunk or enlarged to be as large as possible.

  • fit=cover

    Image will be shrunk or enlarged to exactly fill the entire area specified by width and height. I can be cropped if necessary.

  • fit=crop

    Image will be shrunk and cropped if necessary to fit within the area specified by width and height. The image can't be enlarged. For images smaller than the given dimensions it’s the same as scale-down. For images larger than the given dimensions, it’s the same as cover.

  • fit=pad

    Image will be shrunk or enlarged to be as large as possible, and the extra area will be filled with a background color (white by default).

gravity or g

While using fit=cover or fit=crop, specifies the most important part of the image that shouldn’t be cropped off.

  • gravity=side or gravity=XxY

    Ыide (left, right, top, bottom) or coordinates specified on a scale from 0.0 to 1.0. The X and Y coordinates are separated by lowercase x, e.g. 0x0 means left and top, 1x1 means right and bottom, 0.5x0.5 is the center.

quality=x or q=x

Specifies quality for JPEG and Webp images. The quality is from 1 to 100 scale.

format=x or f=x

Defines output format. We support WebP, JPEG, PNG and GIF output formats, or auto (converts image to WebP if possible).

anim=false

Reduces animations of animated GIFs to still images.

sharpen=x

Specifies strength of sharpening filter. Floating point number between 0 (no sharpening) and 10.

onerror=redirect

In case of a fatal error that prevents the image from being resized or downloaded, redirects to the unresized source image URL specified by (image-source).

metadata

Controls amount of invisible EXIF metadata in JPEG images.

  • metadata=keep

Preserve most of the image metadata when possible.

  • metadata=copyright

    Discard all metadata except EXIF copyright tag. This is the default one.

  • metadata=none

    Discard all invisible metadata.

Supported formats and limitations

The service generates JPEG, PNG, GIF and not animated WebP. It can save animations as GIF.

The service can read JPEG, PNG, GIF (including animations), and not animated WebP images.

Cache Control

Requested images (specified by image-source value) can be cached following the usual rules of HTTP Cache-Control header. Minimum cache time is 1 hour. Resized images follow the same caching rules as the original image they were resized from. If you want to disable cache add no-store, no-cache, must-revalidate, private values or specify max-age less than one hour in Cache-Control header . We also suppot ETag with If-None-Match header from request.