image

Load and inspect images to use as window icons, tray icons and menu item icons.

Images live on the Rust side (they extend Resource), the frontend only holds a handle to them. Call close() when an image is no longer needed, or let it be released when the app exits.

Remarks

Image.fromPath and Image.fromBytes decode PNG and ICO files, which requires the image-png and/or image-ico Cargo features of the tauri crate:

[dependencies]
tauri = { version = "2", features = ["image-png"] }

Image.new takes raw RGBA data and needs no extra feature.

Classes

Image

Source: https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/image.ts#L86

An RGBA Image in row-major order from top to bottom.

Instances are created with Image.new, Image.fromBytes or Image.fromPath and can be passed wherever a JsImage is accepted, such as Window.setIcon, TrayIcon.setIcon or an icon menu item.

Example

import { Image } from '@tauri-apps/api/image';
import { getCurrentWindow } from '@tauri-apps/api/window';

const icon = await Image.fromPath('icons/icon.png');
await getCurrentWindow().setIcon(icon);
await icon.close();

Since

2.0.0

Extends

• Resource

Accessors

rid

Get Signature

get rid(): number;

Source: https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/core.ts#L547

Returns

number

Inherited from

Resource.rid

Methods

[asyncDispose]()

asyncDispose: Promise<void>;

Source: https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/core.ts#L568

Returns

Promise<void>

Inherited from

Resource.[asyncDispose]

close()

close(): Promise<void>;

Source: https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/core.ts#L562

Destroys and cleans up this resource from memory. You should not call any method on this object anymore and should drop any reference to it.

Returns

Promise<void>

Remarks

Uses the core:resources:allow-close permission, which is part of the core:resources:default permission set enabled by default.

Inherited from

Resource.close

rgba()

rgba(): Promise<Uint8Array<ArrayBuffer>>;

Source: https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/image.ts#L202

Returns the RGBA data for this image, in row-major order from top to bottom.

The returned buffer has width * height * 4 bytes, see Image.size.

Returns

Promise<Uint8Array<ArrayBuffer>>

Example

import { Image } from '@tauri-apps/api/image';

const image = await Image.fromPath('icons/icon.png');
const rgba = await image.rgba();

Since

2.0.0

size()

size(): Promise<ImageSize>;

Source: https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/image.ts#L221

Returns the size of this image, in pixels.

Returns

Promise<ImageSize>

Example

import { Image } from '@tauri-apps/api/image';

const image = await Image.fromPath('icons/icon.png');
const { width, height } = await image.size();

Since

2.0.0

fromBytes()

static fromBytes(bytes): Promise<Image>;

Source: https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/image.ts#L147

Creates a new image using the provided bytes by inferring the file format.

Only ico and png are supported (based on activated feature flag).

Note that you need the image-ico or image-png Cargo features to use this API. To enable it, change your Cargo.toml file:

[dependencies]
tauri = { version = "...", features = ["...", "image-png"] }

Parameters

Parameter	Type
bytes	| ArrayBuffer | number[] | Uint8Array<ArrayBufferLike>

Returns

Promise<Image>

Example

import { Image } from '@tauri-apps/api/image';

const bytes = await fetch('/icon.png').then((r) => r.arrayBuffer());
const image = await Image.fromBytes(bytes);

Since

2.0.0

fromPath()

static fromPath(path): Promise<Image>;

Source: https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/image.ts#L181

Creates a new image using the provided path.

Only ico and png are supported (based on activated feature flag).

Note that you need the image-ico or image-png Cargo features to use this API. To enable it, change your Cargo.toml file:

[dependencies]
tauri = { version = "...", features = ["...", "image-png"] }

The path is resolved on the Rust side, so it must be a path on the user’s machine (for example one returned by the path APIs or a bundled resource resolved with resolveResource), not a frontend asset URL.

Parameters

Parameter	Type
path	string

Returns

Promise<Image>

Example

import { Image } from '@tauri-apps/api/image';
import { resolveResource } from '@tauri-apps/api/path';

const image = await Image.fromPath(await resolveResource('icons/icon.png'));

Since

2.0.0

new()

static new(
   rgba,
   width,
   height
): Promise<Image>;

Source: https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/image.ts#L113

Creates a new Image using RGBA data, in row-major order from top to bottom, and with specified width and height.

The buffer must contain exactly width * height * 4 bytes. Unlike Image.fromBytes and Image.fromPath this does not decode an image format, so it requires no extra Cargo feature.

Parameters

Parameter	Type
rgba	| ArrayBuffer | number[] | Uint8Array<ArrayBufferLike>
width	number
height	number

Returns

Promise<Image>

Example

import { Image } from '@tauri-apps/api/image';

// a 1x1 opaque red image
const image = await Image.new(new Uint8Array([255, 0, 0, 255]), 1, 1);

Since

2.0.0

Interfaces

ImageSize

Source: https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/image.ts#L33

Image dimensions, in pixels.

Properties

Property	Type	Description	Defined in
height	number	Image height, in pixels.	Source: https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/image.ts#L37
width	number	Image width, in pixels.	Source: https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/image.ts#L35

Type Aliases

JsImage

type JsImage =
  | string
  | Uint8Array
  | ArrayBuffer
  | number[]
  | Image;

Source: https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/image.ts#L62

A type that can be passed to Rust side as tauri::image::JsImage through transformImage

Values of this type must go through transformImage before being placed in invoke arguments; an Image instance is not serializable on its own.

Variants

• string: Path to an image in the filesystem. Maps to JsImage::Path
• Uint8Array | ArrayBuffer | number[]: ICO or PNG image in raw bytes. Maps to JsImage::Bytes
• Image: An image that was previously loaded with the API and is stored in the resource table. Maps to JsImage::Resource

The string and bytes variants require the image-ico or image-png Cargo features. To enable them, change your Cargo.toml file:

[dependencies]
tauri = { version = "...", features = ["...", "image-png"] }

The Rust JsImage::Rgba variant is intentionally not exposed here; use Image.new to create an image from raw RGBA data instead.

---

MenuIcon

type MenuIcon =
  | JsImage
  | NativeIcon;

Source: https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/image.ts#L65

A type that represents an icon that can be used in menu items.

Functions

transformImage()

function transformImage<T>(image): T;

Source: https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/image.ts#L232

Transforms image from various types into a type acceptable by Rust.

See tauri::image::JsImage for more information. Note the API signature is not stable and might change.

Type Parameters

Type Parameter
T

Parameters

Parameter	Type
image	JsImage | null

Returns

T