Hear from Slack, the ACLU, TED, & more at our customer summit in San Francisco Register
LOG IN SIGN UP
Documentation

Height

Features

Description

The height parameter enables dynamic height resizing based on pixels and percent values. The {value} can be either a positive integer or a float between 0.0 and 0.99. If the height parameter is an integer greater than or equal to 1, the value is interpreted as a pixel height. If the height parameter is a float between 0.0 and 0.99, the value is interpreted as a percentage height. The height parameter will automatically calculate the width of the image according to the aspect ratio of the input image. If a width parameter is present this value will be used instead. If both height and width are omitted, the input image dimensions are used.

API Pattern

height={value}

Parameter

Parameter Description
height Height of the output image.

Parameter Values

Value Units Description
Integer Pixels A whole number between 1 and 8192.
Float Percentage Decimal number between 0.0 and 0.99.

Notes

  1. The maximum output dimensions are 8,192x8,192 pixels.
  2. If the input image is smaller than the desired output dimensions, the image will upscale in size. Upscaling can be turned off using the disable=upscale parameter.
  3. As we use a positive float between 0.0 and 0.99 to return a percentage based scaled image, in order to return an image that is 100% or more, a p parameter can be appended to the value. For example: height=250p would return an image that is 250% the height of the original. We use p as a simple way to represent percent.
  4. Pixel rounding is performed on all calculations in a decimal format (with as much accuracy as possible). The final value is then rounded down.

Examples

Description HTML Demo
Pixel Resize - Resize the height to 200px. <img src="image.jpg?height=200"/> Example
Percentage Resize - Resize the height to 10% of the input image. <img src="image.jpg?height=0.10"/> Example
Percentage Resize - Resize the height to 150% of the input image. <img src="image.jpg?height=150p"/> Example
Advanced Examples (Combining Additional Parameters)
Description HTML Additional Param Demo
Disproportionate Resize - Disproportionally resize to a height of 200px and a width that is 50% of the original. <img src="image.jpg?height=200&width=0.50"/> width Example
Resize to Bounds - Resize the image to fit within the bounds of 150px in height by 150px in width. <img src="image.jpg?height=150&width=150&fit=bounds"/> fit Example
Resize & Device Pixel Ratio - Resize the height to 200px for screens with a device pixel ratio of 2. <img src="image.jpg?height=200&dpr=2"/> dpr Example
Resize & Don't Upscale - Resize the height to 2560px (or to as large as possible) without upscaling the output image. <img src="image.jpg?height=2560&disable=upscale"/> disable Example