Vote for storage transformations

[inian]

This issue is for tracking requests/demand for different image transformations. Give a comment an upvote if you are interested in a particular transformation.

Please refrain from adding comments unless you are adding a transformation which isn't already listed.

[inian]

Image Rotation

[inian]

Blur

[0xflotus]

What kind of Blur are we talking about?

In imagemagick there are some different kinds of blurring an image possible like Gaussian Blur, Motional Blur or Rotational Blur...

And depending of your needs, it is sometimes worth to consider to use something like Blurhash, so you only need to transfer a small hash and not a big bytestream of blurred image data.

[KhaledGabr]

couldn't we blur images using CSS ?

[henryruhs]

blur of images is important if you want to anonymize a profile picture for example

[remorses]

a small blur image could be returned together with the image aspect ratio after you upload an image with the sdk so you can store it in the database and use it as loading placeholder

[inian]

Quality ✅

[segheysens]

Is the main idea here downsampling for compressing image file sizes?

[inian]

yup

[KhaledGabr]

Both lossless and lossy Image compression can be used for reducing file size. But I agree. it's pretty much the most important thing after resizing. People want their images to load quickly and we can't expect them to upload perfectly compressed images.

[inian]

This has been launched with storage v3! Docs for setting the quality are here.

[james2doyle]

Smart Crop

[KhaledGabr]

Is the idea here to set the focal point so that the area of interest in an image doesn't get cropped out ?

[madeleineostoja]

Format conversion ✅

[inian]

we will be adding webp support soon :) We will need to benchmark AVIF encoders since they are notoriously slow, but once we do that AVIF should land soon-ish too.

[inian]

Images going through the render endpoint are automatically converted to WebP now as of Storage V3

[madeleineostoja]

Storage v3 looks awesome! How can I get on the early access list?

[inian]

Webp and quality filters are available for all projects. Here are the docs.

Please send a support ticket via https://app.supabase.com/support/new for resumable uploads

[gustavopch]

SVG -> PNG would be great to create dynamic images.

[0xflotus]

Grayscale

[Macko-pp]

Invert Colors

[vincentjflorio]

In the meantime, this is also a CSS supported feature under the filters property.

https://developer.mozilla.org/en-US/docs/Web/CSS/filter-function/invert

[Macko-pp]

Hue shifting

[psteinroe]

not image, but video: thumbnail generation

[gehlert]

Watermarks

[mrkpatchaa]

Same here. I tried to play a little bit with img_proxy config in self hosted but it's not working.

      IMGPROXY_WATERMARK_PATH: /home/watermark_small.png
      IMGPROXY_PRESETS: default=watermark:1
      IMGPROXY_LOG_LEVEL: "debug"
    volumes:
      - ./volumes/storage:/var/lib/storage:z
      - ./volumes/images:/home:cached

[mrkpatchaa]

My bad. I made it work. Seems like image was cached for a time.
IMGPROXY_PRESETS: default=watermark:1:sowe:10:10:0.4
More info in possible configuration of watermark here https://docs.imgproxy.net/watermark?id=watermarking-an-image

[iamgoddog]

This would be a nice feature.

[kkukshtel]

Would also really love this! Basically, just image compositing. I'm working on a product where users would want to watermark their images for clients

[marcusarnfast]

Rounded corners

Would be nice if we could round the corners of images. Especially considering the limitations of certain email clients like MS Outlook, which do not support CSS properties for rounded borders directly.

Here is how Cloudinary does it.
https://cloudinary.com/cookbook/applying_rounded_corners_to_an_image

[skikrumb-ryan]

Trim https://docs.imgix.com/apis/rendering/trim