Bunny.net

Unpic can transform images with Bunny.net using the bunny provider. It can be used with Unpic framework components, or you can use the base unpic libary to generate image URLs directly.

You can import the bunny provider from the unpic package using a subpath import:

import { transform } from 'unpic/providers/bunny';

If using an Unpic component, you can optionally pass custom operations and options to the component using an object with a bunny key. This is lets you use extra features supported by Bunny.net, or set custom configuration options.

This example uses @unpic/astro, but the same applies to any Unpic component:

---
import { Image } from '@unpic/astro';
---
<Image
  src="image.jpg"
  width={800}
  height={600}
  options={{
      "bunny": {
      // bunny options here
      }
  }}
  operations={{
      "bunny": {
      // bunny operations here
      }
  }}
/>

In supported frameworks you can also import the base component and pass the transformer to it directly. This lets you create a custom component that doesn’t need to include and other transformer code.

---
import { Image } from '@unpic/astro/base';
import { transform } from 'unpic/providers/bunny';
---
<Image
  src="image.jpg"
  width={800}
  height={600}
  transformer={transformer}
/>

Types

The bunny provider supports the following arguments:

Options

The bunny provider does not support any extra configuration options.

Operations

crop

Type: ${number},${number}` | `${number},${number},${number},${number}

Crops the image to the specified dimensions. Supports two formats: width,height or width,height,x,y.

crop_gravity

Type: FocusArea

Sets the gravity for the cropping operation. This defines where the crop should focus.

aspect_ratio

Type: ${number}:${number}

Crops the image to a specific aspect ratio. The gravity defaults to center.

auto_optimize

Type: "low" | "medium" | "high"

Automatically optimizes the image with varying levels of optimization.

sharpen

Type: boolean

Sharpens the image.

blur

Type: number

Blurs the image. Range: 0 to 100.

flip

Type: boolean

Flips the image vertically.

flop

Type: boolean

Flops (mirrors) the image horizontally.

brightness

Type: number

Adjusts the brightness of the image. Range: -100 to 100.

contrast

Type: number

Adjusts the contrast of the image. Range: -100 to 100.

saturation

Type: number

Adjusts the saturation of the image. Range: -100 to 100. -100 for grayscale.

hue

Type: number

Adjusts the hue of the image. Range: 0 to 100.

gamma

Type: number

Adjusts the gamma of the image. Range: -100 to 100.

optimizer

Type: string

Forces Bunny.net to recognize and optimize the image if file detection fails.

output

Type: ImageFormat

The format of the output image.

width

Type: string | number

height

Type: string | number

format

Type: (string & {}) | ImageFormat

quality

Type: string | number

This page is auto-generated from the bunny provider types. See anything wrong or missing? Suggest a change on GitHub.