To PNG

PNG uses lossless compression and preserves transparency through an alpha channel. The encoder lets you trade encoding speed for file size without affecting image quality.

import Foundation
import IMGLYEngine

@MainActor
func toPng(engine: Engine) async throws {
  let assetsBase = "https://cdn.img.ly/packages/imgly/cesdk-swift/1.76.0/assets"
  try engine.editor.setSettingString("basePath", value: assetsBase)
  let sceneURL = URL(string: "\(assetsBase)/ly.img.template/templates/cesdk_postcard_1.scene")!
  try await engine.scene.load(from: sceneURL)

  let page = try engine.scene.getPages().first!

  let blob: Blob = try await engine.block.export(page, mimeType: .png)

  let compressedBlob = try await engine.block.export(
    page,
    mimeType: .png,
    options: ExportOptions(pngCompressionLevel: 9),
  )

  let sizedBlob = try await engine.block.export(
    page,
    mimeType: .png,
    options: ExportOptions(targetWidth: 1920, targetHeight: 1080),
  )

  let outputURL = FileManager.default.temporaryDirectory.appendingPathComponent("export.png")
  try blob.write(to: outputURL)

  _ = compressedBlob
  _ = sizedBlob
}

This guide covers exporting to PNG, configuring compression and dimensions, and saving exports to disk.

Export to PNG#

Export a design block by calling engine.block.export(_:mimeType:options:) with .png as the MIME type. The call returns a Blob (a Data value) containing the encoded image.

let blob: Blob = try await engine.block.export(page, mimeType: .png)

Pass a page returned by engine.scene.getPages(), or any other block ID, to export specific elements.

Export Options#

PNG export reads these fields from ExportOptions:

Compression Level#

The pngCompressionLevel field (0–9) controls the trade-off between file size and encoding speed. Higher values produce smaller files but take longer to encode. PNG compression is lossless, so quality is never affected.

let compressedBlob = try await engine.block.export(
  page,
  mimeType: .png,
  options: ExportOptions(pngCompressionLevel: 9),
)

• 0 — No compression, fastest encoding
• 5 — Balanced (default)
• 9 — Maximum compression, slowest encoding

Target Dimensions#

Specify targetWidth and targetHeight together to export at exact dimensions. The output fills the target size while maintaining aspect ratio.

let sizedBlob = try await engine.block.export(
  page,
  mimeType: .png,
  options: ExportOptions(targetWidth: 1920, targetHeight: 1080),
)

If the target aspect ratio differs from the block’s aspect ratio, the output extends beyond the target on one axis to preserve proportions.

Save to File System#

The returned Blob is a Data value, so writing it to disk is a single call to write(to:).

let outputURL = FileManager.default.temporaryDirectory.appendingPathComponent("export.png")
try blob.write(to: outputURL)

When to Use PNG#

PNG works well for:

• Graphics with sharp edges, text, and UI elements
• Designs that require transparency
• Logos, icons, and illustrations where pixel-perfect output matters

Troubleshooting#

File too large — Increase pngCompressionLevel toward 9, or reduce dimensions with targetWidth and targetHeight. For photographic content, switch to JPEG or WebP.

Encoding feels slow — Lower pngCompressionLevel toward 0. The default 5 is balanced; 0 disables compression entirely for the fastest encode.

Transparent areas appear black — Ensure the page or block has a transparent background fill. PNG preserves alpha when the source block is transparent.

API Reference#

Next Steps#

• Export Overview — Compare all available export formats
• Export to JPEG — Use the photo-friendly format when transparency isn’t needed
• Partial Export — Export specific blocks, groups, or page elements instead of entire scenes
• Export Size Limits — Check device export limits before exporting large designs