Image URL API

The aspectRatio parameter is a string that allows you to control the proportions of your image by specifying the width-to-height ratio. It takes the form of a fraction, with the width and height separated by a colon (:). For example, 1:1 represents a square aspect ratio, while 4:3 represents a more rectangular shape commonly used in standard images.

Here are some examples of popular aspect ratios and their corresponding values:

• Square: 1:1
• Standard Image: 4:3
• Landscape Image: 16:9
• Instagram Post: 4:5
• Pinterest Pin: 2:3

By setting the aspect ratio parameter, you can ensure that your images are displayed in the correct proportions, regardless of the device or screen size.

Usually used together with

The avif parameter allows you to programmatically enable or disable AVIF compression for your images. By default, our CDN will automatically detect if a user's browser supports AVIF and will deliver the image in the appropriate format. However, you can use the AVIF CDN parameters to override this default behavior and force the delivery of images in AVIF format, regardless of the browser's support for it. This gives you more control over how your images are delivered and can help to optimize your website or application for improved performance.

The background parameter allows for customization of the image's background. It can take various values, including a hex string to set a solid color background, a comma-separated string to generate gradients, an image URL to use as the background, the self-image to use as the background, or even a blurhash version of the image. The background parameter enables users to create unique images with personalized backgrounds that complement the image's content. It provides an excellent opportunity for designers, marketers, and content creators to showcase their creativity and enhance their visual storytelling.

The bgAspectRatio parameter is used to change the aspect ratio of the background image or color used in image transformations. This parameter accepts a string in the format of width:height (e.g., 16:9, 4:3) or a floating-point number representing the ratio of width to height (e.g., 1.5, 0.75).

By default, the background image or color will be displayed with the same aspect ratio as the original image. However, if the bgAspectRatio parameter is provided, the background will be adjusted to fit the specified aspect ratio, which can be useful for creating custom compositions or changing the overall visual look of an image.

For example, setting bgAspectRatio=1:1 would create a square background for the image, while bgAspectRatio=16:9 would create a widescreen background. The bgAspectRatio parameter can be used in combination with other image transformation parameters to achieve a wide range of visual effects.

Usually used together with

The bgBlackWhite parameter is a boolean parameter that allows you to remove the color from the background of an image. When this parameter is set to true, the background will be converted to black and white, creating a grayscale effect. This can be useful if you want to de-emphasize the background and bring more attention to the foreground or subject of the image. On the other hand, if you want to preserve the original color of the background, you can simply set this parameter to false or omit it from the URL parameters.

Usually used together with

The bgBlur parameter is a numerical value that can be used to apply a Gaussian blur effect to the image's background. This parameter can be useful for creating a more visually appealing design by softening the background and bringing focus to the image's subject.

The value for bgBlur ranges from 0 to 100, where 0 means no blur and 100 means the maximum blur effect. The higher the value, the more blurred the background will appear.

For example, a bgBlur value of 20 would apply a slight blur to the background, while a value of 80 would create a more noticeable blur effect. The exact amount of blur that works best for an image can vary based on factors such as image resolution, background color, and overall design aesthetic.

Usually used together with

The bgBrightness parameter allows you to adjust the brightness of the background of your image. You can use a value between -100 and 100, where -100 is completely black and 100 is completely white. Positive values will brighten the background while negative values will darken it. This can be useful if you want to make the background more visible or less distracting, or if you want to adjust the contrast between the foreground and background.

Usually used together with

The bgGradientDir parameter is used to define the direction of a gradient background applied to an image. This parameter can be defined as left, right (which is the default), top, or bottom. When the parameter is set, a gradient will be generated using the specified direction, with colors that transition smoothly from the start to the end of the gradient. This can be useful for creating visually interesting backgrounds for images.

Possible values

• left string
• right string (default)
• top string
• bottom string

Usually used together with

The bgGradientSharp parameter adjusts the sharpness of the background gradient. It accepts a numeric value, where 0 is the softest (default) and 20 is the sharpest.

When set to a lower value, the gradient will have more visible color bands, and the transition between colors will appear sharper. On the other hand, when set to a higher value, the gradient will have a more subtle transition between colors, making it appear softer.

This parameter is useful when generating gradients as backgrounds and allows for more control over the appearance of the final image.

Usually used together with

The bgHeight parameter is used to define the height of the background. It takes a number in pixels as input, and if the height is lower than the main image, the background will be reduced to fit. This parameter can be useful when you want to add a background to an image and make sure it has a specific height.

For example, if you have an image with a height of 800 pixels and you want to add a background with a height of 100 pixels, you can use the bgHeight=100 parameter to set the height of the background. If you set the bgHeight parameter to a higher value than the main image, the background will be stretched to fit the new height.

Overall, the bgHeight parameter allows you to customize the height of your background, and ensure that it is the correct size for your needs.

Usually used together with

The bgPad parameter allows you to adjust the padding of an image relative to the background. This can be done in two ways - using an absolute or relative value.

With an absolute value, you can specify the number of pixels to pad the image from the background. For example, a value of 10 would add a 10-pixel padding around the image.

With a relative value, you can specify a percentage of the image size to pad from the background. For example, a value of 10.0 would add a 10% padding around the image.

This feature is especially useful when you need to adjust the spacing between the image and the background, or when you want to create a more dynamic and visually appealing composition.

Usually used together with

The bgRounded parameter is used to adjust the rounded corners of the background of an image. This parameter can take either an absolute or a relative value. An absolute value is given in pixels, while a relative value is given as a percentage of the image size.

For example, bgRounded=20 sets an absolute value of 20 pixels for the background rounding, while bgRounded=10.0 sets a relative value of 10% of the image size for the background rounding.

This parameter can be useful for creating images with a rounded background, which can add a touch of elegance or personality to an image. By adjusting the bgRounded parameter, you can customize the level of rounding to suit your specific needs.

Usually used together with

The bgSaturation parameter is a number that can be used to adjust the saturation of the background image. A value of -100 will result in a completely desaturated (black and white) image, while a value of 0 (default) will preserve the original saturation of the image. Values between 0 and 100 will adjust the saturation accordingly. This parameter can be useful when trying to create a specific aesthetic or look for an image composition.

Usually used together with

The bgShadow parameter is a boolean option that allows you to apply a drop shadow effect to the main image when used in conjunction with a background. By enabling this parameter, you can add depth and dimension to your images, making them stand out from the background and creating a visually appealing effect.

Usually used together with

The bgSize parameter is a shortcut to define the background size in pixels, using the format wxh (e.g., 200x200). For example, bgSize=800x800 would set the background size to 800 pixels wide and 800 pixels high.

Usually used together with

bgWidth is a numeric value in pixels that defines the width of the background. If the width is lower than the main image, the background will be reduced to fit. This parameter can be used in combination with other background parameters, such as bgHeight or bgAspectRatio, to create custom backgrounds for your images.

This will set the width of the background to 1200 pixels, and if the main image is wider than 1200 pixels, it will be scaled down to fit the background.

Usually used together with

The blackWhite parameter is a simple yet powerful way to convert an image to grayscale. By setting this boolean parameter to true, all color information is stripped from the image, resulting in a black and white version of the original. This can be useful for creating a vintage or artistic look, or simply for reducing the file size of an image. It can also be used in conjunction with other parameters to create custom effects.

The blend parameter is a powerful way to overlay a color or gradient on top of an image. It takes a single color or multiple comma-separated colors, which will be used to create a gradient. This parameter can be used to add an overlay to an image, or to create a duotone effect by blending two colors.

For example, blend=blue will overlay a blue color on top of the image, while blend=yellow,blue will create a gradient that goes from blue to yellow.

The blendGradientDir parameter is used to define the direction of a gradient blend applied to an image. This parameter can be defined as left, right (which is the default), top, or bottom. When the parameter is set, a gradient will be generated using the specified direction, with colors that transition smoothly from the start to the end of the gradient. This can be useful for creating visually interesting blends for images.

Possible values

• left string
• right string (default)
• top string
• bottom string

Usually used together with

The blendGradientSharp parameter adjusts the sharpness of the blend gradient. It accepts a numeric value, where 0 is the softest (default) and 20 is the sharpest.

When set to a lower value, the gradient will have more visible color bands, and the transition between colors will appear sharper. On the other hand, when set to a higher value, the gradient will have a more subtle transition between colors, making it appear softer.

This parameter is useful when generating gradients as blends and allows for more control over the appearance of the final image.

Usually used together with

The blendMode parameter is used to define how the overlay created by the blend parameter should be blended with the original image. This parameter can be set to a variety of values, such as multiply, screen, overlay, hardlight, and many more. Each value produces a different effect when blending the two images together, allowing for a wide range of creative possibilities.

For example, setting blend to a solid color and blendMode to multiply can create a darkening effect on the original image, while setting blend to a gradient and blendMode to overlay can create a textured overlay.

Overall, the blendMode parameter adds another layer of control to the blend parameter, allowing for even more customization and creativity when transforming images.

Possible values

• add string
• color string
• colorburn string
• colordodge string
• darken string
• darkercolor string
• difference string
• divide string
• exclusion string
• hardlight string
• hardmix string
• hue string
• lighten string
• lightercolor string
• linearburn string
• lineardodge string
• linearlight string
• luminosity string
• multiply string (default)
• none string
• overlay string
• phoenix string
• pinlight string
• reflex string
• saturation string
• screen string
• softlight string
• substract string
• vividlight string

Usually used together with

The blendOpacity parameter is used to adjust the opacity of the overlay when the blendMode parameter is set to "none". The default value is 75, but it can be adjusted to increase or decrease the opacity of the overlay. This parameter only applies when using a flat color or gradient as the overlay, and not when using other blend modes.

Usually used together with

The blur parameter applies Gaussian blur to an image. This parameter takes a numeric value that represents the standard deviation of the Gaussian blur kernel, which determines the amount of blur to be applied. A larger value will result in a more blurred image, while a smaller value will result in less blur.

The blur parameter is particularly useful for creating a background or adding an artistic effect to an image. By applying a Gaussian blur to the background, the foreground object can be emphasized and stand out more.

The brightness parameter is used to adjust the overall brightness of an image. It can take a value from -100 to 100, with 0 being the default brightness. A positive value increases the brightness of the image, while a negative value decreases it. For example, a brightness value of 50 would increase the brightness by 50%, making the image appear lighter, while a value of -50 would decrease the brightness by 50%, making the image appear darker.

The brightness parameter can be used to adjust the exposure of an image, enhance or reduce the visibility of details, or to create a particular atmosphere or mood in the image. It is often used in combination with other image processing techniques like contrast, saturation, and sharpness to achieve a desired visual effect.

The dpr parameter, short for device pixel ratio, is used to specify the resolution of the image for devices with high pixel density screens. It starts from 1 and goes up to a maximum of 2, where 1 represents a standard resolution and 2 represents a high resolution.

When the dpr parameter is not provided, the system automatically detects the device pixel ratio of the user's browser and serves the image at the appropriate resolution. For example, if a user with a high pixel density screen opens a page with an image that has no dpr parameter, the system will automatically serve the image with a higher resolution to ensure that it looks sharp and clear on the user's screen.

Providing a dpr parameter can be useful for optimizing the image size and quality for different device types. For example, if you have an image that is 1000 pixels wide, you could serve it with a dpr of 1 for standard resolution devices and a dpr of 2 for high resolution devices. This would result in the image being displayed at 1000 pixels on standard resolution devices and 2000 pixels on high resolution devices, ensuring that it looks sharp and clear on both types of devices.

The focalPoint parameter is a powerful tool to control the cropping of an image. It allows you to specify the point of interest in the image that should be centered in the final crop. If you do not provide a focalPoint, our system will use an intelligent algorithm to automatically determine the best crop for the image based on object detection.

By using the focalPoint parameter, you can ensure that your images are cropped exactly as you want them to be, with the most important parts of the image always visible.

Possible values

• auto string (default)
• bottom-left string
• bottom-right string
• bottom string
• center string
• left-bottom string
• left-top string
• left string
• right-bottom string
• right-top string
• right string
• top-left string
• top-right string
• top string

The format parameter is used to specify the image file format to be used. It can be set to "png" or "jpg", but if it is not specified, the system will choose the best format based on some heuristics, such as the input file type and the desired output quality.

PNG is a lossless image format that supports transparency and is generally used for images with text, line art, or other graphics with sharp edges. On the other hand, JPG is a lossy image format that is suitable for photographic images and other images with smooth transitions between colors.

It's important to note that using the right image format can have a significant impact on the image quality and file size. Therefore, it's recommended to choose the format carefully based on the type of image and its intended use.

Possible values

• auto string (default)
• jpg string
• png string

The height parameter is used to define the height of an image in pixels. It can be used alone or in conjunction with the width parameter to set the dimensions of the image.

When used alone, the height parameter will set the height of the image while preserving its aspect ratio. If the image is wider than it is tall, it will be scaled down proportionally so that it fits within the specified height. If the image is taller than it is wide, it will be scaled down proportionally so that it fits within the specified height, with blank space added to the sides of the image.

When used with the width parameter, the height parameter will set the height of the image while preserving its aspect ratio. If the mode parameter is set to fit (the default value), the image will be scaled down proportionally to fit within the specified dimensions, with blank space added to either the top/bottom or left/right sides of the image to fill any remaining space. If the mode parameter is set to fill, the image will be scaled up or down proportionally so that it completely fills the specified dimensions, with any excess portions of the image cropped out.

The mark parameter is used to add a watermark to an image. It can accept an internal or external source for the watermark. When using an external source, the URL should be specified. The watermark is placed in the bottom right of the image by default.

The markAlign parameter is used to specify the alignment of a watermark image that is added to an image using the mark parameter. It controls the positioning of the watermark image on the main image.

The markAlign parameter supports the following values:

• center: This value centers the watermark image both horizontally and vertically on the main image.
• top, bottom, left, right: These values align the watermark image to the respective edge of the main image.
• top-left, top-right, bottom-left, bottom-right: These values align the watermark image to the respective corner of the main image.
• left-top, left-center, left-bottom, right-top, right-center, right-bottom: These values align the watermark image to a position on the edge of the main image, with an offset in pixels from the edge.

Additionally, the markAlign parameter can also be grid. In this case, the watermark image is tiled across the main image, with an offset in pixels from the edge of the main image.

Usually used together with

The markAngle parameter is used to rotate the watermark image by a specified angle in degrees. It accepts values between -180 and 180, where negative values represent a counterclockwise rotation and positive values represent a clockwise rotation.

For example, if the markAngle parameter is set to 45, the watermark image will be rotated clockwise by 45 degrees. Similarly, if the markAngle parameter is set to -90, the watermark image will be rotated counterclockwise by 90 degrees.

It's important to note that the markAngle parameter is only applicable if the watermark image is in a landscape orientation. If the watermark image is in portrait orientation, it will not be rotated. Additionally, if the markAngle parameter is not provided, the watermark image will be placed in its default orientation.

Usually used together with

The markBg parameter is used in conjunction with the mark parameter to specify the background color or gradient for a watermark that is being applied to an image. This parameter can be set to a single flat color or to a gradient if multiple colors are provided as a comma-separated list.

When a single color is specified, the watermark will have a uniform background color. If a gradient is specified, the background color will gradually transition from one color to the next across the watermark.

The syntax for setting a gradient with the markBg parameter is the same as for other gradient parameters, with each color and position separated by a comma. For example, setting markBg=yellow,purple would create a gradient that transitions from yellow to purple.

It is important to note that the markBg parameter only affects the background color or gradient of the watermark, and does not affect the color or transparency of the watermark itself.

Usually used together with

The markBgGradientDir parameter is used to define the direction of a mark gradient background applied to an image. This parameter can be defined as left, right (which is the default), top, or bottom. When the parameter is set, a gradient will be generated using the specified direction, with colors that transition smoothly from the start to the end of the gradient. This can be useful for creating visually interesting backgrounds for images.

Possible values

• left string
• right string (default)
• top string
• bottom string

Usually used together with

The markBgGradientSharp parameter adjusts the sharpness of the background gradient. It accepts a numeric value, where 0 is the softest (default) and 20 is the sharpest.

When set to a lower value, the gradient will have more visible color bands, and the transition between colors will appear sharper. On the other hand, when set to a higher value, the gradient will have a more subtle transition between colors, making it appear softer.

This parameter is useful when generating gradients as backgrounds and allows for more control over the appearance of the final image.

Usually used together with

The markBgOpacity is a parameter used in image processing that specifies the opacity of the background color or gradient used for a watermark. The value ranges from 0 to 100, where 0 represents a completely transparent background, and 100 represents a completely opaque background. This parameter is typically used in conjunction with the markBg parameter to set the background color or gradient of the watermark. By adjusting the markBgOpacity, you can control the visibility of the background color or gradient, allowing you to create subtle or more prominent watermarks on your images.

Usually used together with

The markBgPad parameter is used in conjunction with the markBg parameter to set the padding around the watermark background. It can be defined as an absolute value in pixels or as a relative value, which is a percentage of the watermark's width.

For example, markBgPad=10 would set a 10-pixel padding around the watermark background, while markBgPad=10.0 would set a padding of 10% of the watermark's width. If no value is specified, the padding defaults to 10.0.

Usually used together with

The markBgRounded parameter is used to add rounded corners to the background of the watermark. This parameter can take an absolute value in pixels or a relative value as a percentage of the watermark's width or height.

For example, if markBgRounded is set to 10, the corners of the watermark's background will be rounded by 10 pixels. If it is set to 10.0, the corners will be rounded by 10% of the watermark's width or height.

This parameter can be useful to make the watermark blend more naturally with the image by avoiding sharp corners. It is also a way to add a subtle touch of design to the watermark itself.

Usually used together with

The markHeight parameter sets the height of the watermark image. This parameter can be specified as an absolute or relative value.

When an absolute value is used, the watermark image will have the exact height specified in pixels. For example, markHeight=50 would set the height of the watermark image to 50 pixels.

When a relative value is used, the watermark image will have a height proportional to the height of the original image. For example, markHeight=10.0 would set the height of the watermark image to 10% of the height of the original image.

It is important to note that if both markWidth and markHeight parameters are provided, the watermark will be resized to fit within the given dimensions while preserving its aspect ratio.

Usually used together with

The markOpacity parameter is used to adjust the opacity of a watermark that is applied to an image using the mark parameter. The value of this parameter can range from 0 to 100, where 0 is completely transparent and 100 is completely opaque. By adjusting the markOpacity parameter, you can control how visible the watermark is in the final image.

For example, if you set the markOpacity to 50, the watermark will be partially transparent and the underlying image will be partially visible through it. Conversely, if you set the markOpacity to 100, the default, the watermark will be completely opaque and the underlying image will be completely covered by it.

Usually used together with

The markPad parameter is used to set the padding around a watermark image that is added to a main image using the mark parameter. The value of the markPad parameter can be either an absolute or a relative value.

If an absolute value is used, it sets the padding in pixels around the watermark image. For example, markPad=10 would add a padding of 10 pixels around the watermark image.

If a relative value is used, it sets the padding as a percentage of the width or height of the main image, depending on whether the watermark image is aligned horizontally or vertically. For example, markPad=10.0 would add a padding of 10% of the main image width or height around the watermark image, depending on its alignment.

Usually used together with

The markSize parameter is a shortcut parameter that allows you to set the size of a watermark in a single parameter instead of specifying both the markWidth and markHeight parameters separately. The value of the markSize parameter should be in the format wxh (e.g., 200x200).

This parameter is useful when you want to set the watermark size without specifying the markWidth and markHeight parameters separately. By using markSize, you can save time and simplify your code. Keep in mind that the markSize parameter overrides any values set for markWidth and markHeight.

Usually used together with

The markWidth parameter is used to specify the width of the watermark image that is being added to the original image. It can be defined as an absolute value in pixels or a relative value as a percentage of the original image width.

When an absolute value is used, the watermark image will have the exact width specified in pixels. For example, markWidth=50 would set the width of the watermark image to 50 pixels.

When a relative value is used, the watermark image will have a width proportional to the width of the original image. For example, markWidth=10.0 would set the width of the watermark image to 10% of the width of the original image.

It is important to note that if both markWidth and markHeight parameters are provided, the watermark will be resized to fit within the given dimensions while preserving its aspect ratio.

Usually used together with

The maxHeight parameter is used to set the maximum height of the output image. If the original image height is greater than the maxHeight value, it will be scaled down to fit within the specified height while preserving the aspect ratio. If the original image height is already smaller than the specified maxHeight value, then no scaling is performed.

For example, if the original image height is 1000 pixels and the maxHeight value is set to 500, the image will be scaled down to 500 pixels in height while preserving its aspect ratio. On the other hand, if the original image height is only 400 pixels and the maxHeight value is set to 500, the image will not be scaled as it already fits within the maximum height constraint.

It's worth noting that the maxHeight parameter takes priority over the height parameter. If both are specified, the image will be scaled to the specified maxHeight if greater than height.

The maxWidth parameter is used to specify the maximum width of the transformed image. If the original image width is greater than the specified maxWidth, the image will be resized proportionally until it meets the specified maximum width. If the original image width is smaller than the specified maxWidth, the image will not be resized.

It is important to note that maxWidth only specifies a maximum limit and not an exact width. The actual width of the transformed image may be smaller than maxWidth if it is necessary to preserve the aspect ratio of the original image.

The maxWidth parameter is often used in conjunction with the height parameter to create images that fit within a specific size constraint while maintaining their aspect ratio. The combination of maxWidth and height ensures that the transformed image fits within the maximum width and height constraints, with the final size determined by the aspect ratio of the original image.

It's worth noting that the maxWidth parameter takes priority over the width parameter. If both are specified, the image will be scaled to the specified maxWidth if greater than width.

The mode parameter in image processing refers to the way the image should be resized or cropped to fit within certain dimensions. The mode can be set to either fit or fill.

When the mode is set to fit, the image will be resized to fit within the specified dimensions while preserving its aspect ratio. If either the width or height is not specified, the original dimensions of the image will be used. This is similar to the contain method of resizing. In other words, the image will be scaled down proportionally until it fits within the specified dimensions, and any empty space will be filled with a background color or transparency.

When the mode is set to fill, the image will be resized and cropped to fill the specified dimensions while maintaining its aspect ratio. This is similar to the cover method of resizing. In other words, the image will be scaled up or down proportionally to completely fill the specified dimensions, and any excess will be cropped off.

You can use focalPoint parameter to specifies the point in the image that should remain in focus. In this mode, the focal point is used as a guide to determine which part of the image should be preserved, and the rest of the image is cropped out. The image is then scaled to fill the desired dimensions while keeping the focal point in the center of the resulting image.

This mode is useful when you want to ensure that a particular part of the image remains visible while cropping out the excess. The focalPoint parameter allows you to define the area of the image that is most important, ensuring that it remains in the final image.

On the other hand, when the focalPoint parameter is not defined, SimpleImg uses advanced algorithms to automatically detect the most important part of an image and crop it accordingly. This ensures that the image is resized to the specified dimensions while maintaining the important content of the image.

It is important to note that if neither the width nor height is specified, the original dimensions of the image will be used.

Possible values

• fit (or contain) string (default)
• fill (or cover) string

The qr parameter is used to add a QR code to the image. It is a string value that represents the data to be encoded as a QR code. The QR code is automatically generated and added to the image. By default, the QR code is positioned at the bottom-right corner of the image.

This parameter can be useful in situations where you want to include a QR code in an image, for example, to provide a quick way for users to access a webpage or to provide additional information about a product.

It's worth noting that some image transformations may not be compatible with the QR code. In such cases, the QR code may not be generated correctly or may be partially or completely obscured. Therefore, it's important to test the output image to ensure that the QR code is working as expected.

The qrAlign parameter is used to specify the alignment of the QR code that is added to an image using the qr parameter. It controls the positioning of the QR code on the main image.

The qrAlign parameter supports the following values:

• center: This value centers the QR code both horizontally and vertically on the main image.
• top, bottom, left, right: These values align the QR code to the respective edge of the main image.
• top-left, top-right, bottom-left, bottom-right: These values align the QR code to the respective corner of the main image.
• left-top, left-center, left-bottom, right-top, right-center, right-bottom: These values align the QR code to a position on the edge of the main image, with an offset in pixels from the edge.

Usually used together with

The qrBorder parameter is used to set the color of the border around the QR code added to an image using URL parameters. It accepts a string value representing a color code in HEX, RGB, or named format.

For example, if you want to set a red border color around the QR code, you can add the qrBorder parameter to the URL with the value FF0000.

Usually used together with

The qrPad parameter is used to set the padding around the QR code that is added to a main image using the qr parameter. The value of the qrPad parameter can be either an absolute or a relative value.

If an absolute value is used, it sets the padding in pixels around the QR code. For example, qrPad=10 would add a padding of 10 pixels around the QR code.

If a relative value is used, it sets the padding as a percentage of the width or height of the main image, depending on whether the QR code is aligned horizontally or vertically. For example, qrPad=10.0 would add a padding of 10% of the main image width or height around the QR code, depending on its alignment.

Usually used together with

The qrRounded parameter is a boolean used to control the corners of the QR code image. When set to true or not specified, it rounds the corners of the QR code, and when set to false, the corners are left square. This parameter can be useful when you want to add a QR code to an image but want to match the style of the image, for example, by rounding the corners of the QR code to match the rounded corners of the main image.

Usually used together with

The qrSize parameter is used to set the size of the QR code image in the composite image. It accepts a numeric value which can be either absolute or relative. The value represents the width and the height of the square QR code. For example, if you set the qrSize=200, the QR code image will be a square with a width and height of 200 pixels.

If the value is relative, it will be calculated based on the dimensions of the main image. For example, if you set qrSize=50.0, the QR code will have a size equal to 50% of the width of the main image.

It's important to note that the qrSize parameter only sets the size of the QR code, not the entire composite image. If you want to set the size of the entire composite image, you should use the width and height parameters instead.

Usually used together with

The qrText parameter is used to add a top text to a QR code that is overlaid onto an image. This text can provide additional information related to the QR code or can be used for branding purposes. The qrText parameter accepts a string value that represents the text to be displayed on top of the QR code.

Usually used together with

The qrTextBottom parameter is used to add a bottom text to a QR code that is overlaid onto an image. This text can provide additional information related to the QR code or can be used for branding purposes. The qrTextBottom parameter accepts a string value that represents the text to be displayed on top of the QR code.

Usually used together with

The qrTextColor parameter is used to set the color of the text in the QR code. It can be set using either a hex string or a named color. A hex string is a six-digit code that represents the RGB values of the color, while a named color is a predefined color that has a name.

For example, to set the text color of the QR code to red, you can use the hex string ff0000, which represents pure red in RGB color space. Alternatively, you can use the named color red to achieve the same result.

Usually used together with

The qrTextFont parameter is used to specify the font style for the text that is added to QR code image. It can take the following values:

• impact: This is the default value and it uses the Impact font style for the text.
• bold: This option uses a bold version of the Impact font style.
• medium: This option uses a medium weight version of the Impact font style.
• mono: This option uses a monospace font style for the text.
• monobold: This option uses a bold monospace font style for the text.

The font style is applied to the text specified in the qrText parameter, which is the string that appears on the QR code image.

Usually used together with

The rounded parameter is used to add rounded corners to an image. It can be specified as either an absolute or relative value.

When specified as an absolute value, the rounded parameter determines the radius of the curve in pixels. For example, rounded=20 would create a curve with a radius of 20 pixels.

When specified as a relative value, the rounded parameter determines the percentage of the image width or height that should be used as the radius. For example, rounded=50.0 would create a curve with a radius equal to 50% of the image width or height (whichever is smaller).

The rounded parameter can be used in combination with other parameters, such as width and height, to create images with rounded corners that are resized to specific dimensions. The resulting image will have the specified width and height, with the corners rounded according to the rounded parameter.

It's important to note that the rounded parameter only affects the corners of the image, and will not affect any other parts of the image. Additionally, if the image is already smaller than the specified width and height parameters, the image will not be enlarged to fit the dimensions, and the rounded parameter will only affect the existing image size.

The saturation parameter is a number that can be used to adjust the saturation of the image. A value of -100 will result in a completely desaturated (black and white) image, while a value of 0 (default) will preserve the original saturation of the image. Values between 0 and 100 will adjust the saturation accordingly. This parameter can be useful when trying to create a specific aesthetic or look for an image composition.

The size parameter is a shortcut to define the size in pixels, using the format wxh (e.g., 200x200). For example, size=800x800 would set the image size to 800 pixels wide and 800 pixels high.

The src parameter can also be an external URL pointing to an image file. In this case, the image will be fetched and transformed by the service, and the resulting URL can be used to display the transformed image. This feature is useful when you want to transform an image hosted on a different server or domain, without having to download and re-upload it to your own server.

The text parameter is used to add text to an image. This parameter takes a string value, which specifies the text that needs to be added to the image. The size of the text will be automatically adjusted to fit in the specified space, which is determined by the textWidth and textHeight parameters.

The textAlign parameter is used to specify the alignment of the text that is added to an image using the text parameter. It controls the positioning of the text on the main image.

The textAlign parameter supports the following values:

• center: This value centers the text both horizontally and vertically on the main image.
• top, bottom, left, right: These values align the text to the respective edge of the main image.
• top-left, top-right, bottom-left, bottom-right: These values align the text to the respective corner of the main image.
• left-top, left-center, left-bottom, right-top, right-center, right-bottom: These values align the text to a position on the edge of the main image, with an offset in pixels from the edge.

Usually used together with

The textBreak parameter is a boolean parameter used to enable or disable automatic text breaking in an image when using the text parameter. When the textBreak parameter is set to true, the text will be automatically broken into multiple lines to fit within the specified width of the image. If the parameter is set to false, the text will not be broken, and the text will overflow the specified width, potentially causing the text to become truncated or cropped.

Usually used together with

The textColor parameter is used to set the color of the text . It can be set using either a hex string or a named color. A hex string is a six-digit code that represents the RGB values of the color, while a named color is a predefined color that has a name.

For example, to set the text color to red, you can use the hex string ff0000, which represents pure red in RGB color space. Alternatively, you can use the named color red to achieve the same result.

Usually used together with

The textFont parameter is used to specify the font style for the text. It can take the following values:

• impact: This is the default value and it uses the Impact font style for the text.
• bold: This option uses a bold version of the Impact font style.
• medium: This option uses a medium weight version of the Impact font style.
• mono: This option uses a monospace font style for the text.
• monobold: This option uses a bold monospace font style for the text.

The font style is applied to the text specified in the text parameter.

Usually used together with

The textHeight parameter is used to set the height of the text container in which the text will be placed. It can be set as an absolute value in pixels or as a relative value using percentages.

When an absolute value is used, the text container will have a fixed height in pixels. When a relative value is used, the height of the text container will be determined based on a percentage of the height of the source image.

The textHeight parameter is useful when you want to limit the vertical space that the text takes up in the image. By setting a maximum height, you can ensure that the text does not overflow or crowd the rest of the image.

For example, setting textHeight=100 would limit the height of the text container to 100 pixels, while setting textHeight=50.0 would limit the height of the text container to 50% of the height of the source image.

Usually used together with

The textLineHeight parameter is used to set the line height of the text in the image. It is a numeric value that represents the height of each line. The default value is 1, which means that the line height will be automatically calculated based on the font size and the aspect ratio of the text container.

If you want to set a specific line height, you can provide a numeric value for the textLineHeight parameter. For example, a value of 1.5 would set the line height to 150% of the font size, while a value of 2 would set it to double the font size.

Setting the line height can be useful when you want to control the spacing between lines of text, or when you have multiple lines of text and you want to make sure that they are evenly spaced.

Usually used together with

The textPad parameter is used to set the padding around the text that is added to a main image using the text parameter. The value of the textPad parameter can be either an absolute or a relative value.

If an absolute value is used, it sets the padding in pixels around the text. For example, textPad=10 would add a padding of 10 pixels around the text.

If a relative value is used, it sets the padding as a percentage of the width or height of the main image, depending on whether the text is aligned horizontally or vertically. For example, textPad=10.0 would add a padding of 10% of the main image width or height around the text, depending on its alignment.

Usually used together with

The textSize parameter is used to specify the maximum font size of the text that will be added to the image. This parameter can take either an absolute or a relative value. If an absolute value is used (like textSize=50), it will be interpreted as the maximum font size in pixels. If a relative value is used (like textSize=5.0), it will be interpreted as a percentage of the image height.

By default, the textSize parameter is set to 5% of the image height. This means that the font size will automatically adjust depending on the size of the image. For example, if the image is very small, the font size will be small as well to avoid overcrowding the image with text. On the other hand, if the image is very large, the font size will be larger as well to ensure that the text is readable.

It is important to note that the actual font size used may be smaller than the specified maximum size if the text needs to be resized to fit within the specified text container size (as determined by the textHeight parameter). Additionally, if the textSize value is too large relative to the available space, the text may be cut off or may not fit within the specified text container. Therefore, it is recommended to use a reasonable maximum font size value and to test the output for each image size and text content.

Usually used together with

The textWidth parameter is used to set the width of the text container in which the text will be placed. It can be set as an absolute value in pixels or as a relative value using percentages.

When an absolute value is used, the text container will have a fixed width in pixels. When a relative value is used, the width of the text container will be determined based on a percentage of the width of the source image.

The textWidth parameter is useful when you want to limit the vertical space that the text takes up in the image. By setting a maximum width, you can ensure that the text does not overflow or crowd the rest of the image.

For example, setting textWidth=100 would limit the width of the text container to 100 pixels, while setting textWidth=50.0 would limit the width of the text container to 50% of the width of the source image.

Usually used together with

The webp parameter is a boolean option that can be used to enable or disable WebP compression programmatically. When this parameter is set to "true", the image will be served in the WebP format if the browser supports it. If the parameter is set to "false", the image will be served in the original format. This parameter is useful for optimizing image delivery and reducing page load times, especially for users on slow connections or with limited data plans.

The width parameter defines the width of the output image. If used with or without the height parameter, the image's aspect ratio is maintained to avoid distorting the image.

When the mode parameter is set to fit, the image is scaled down proportionally so that it fits within the specified width and height values. This means that the image may be smaller than the specified width and height values.

On the other hand, when the mode parameter is set to fill, the image is scaled proportionally to completely fill the specified width and height values. This may result in parts of the image being cropped to fit the specified dimensions.