Best way to transfer image from Figma to Plugin UI

Hello,
What would be the best way to send an image (fill) content from Figma to a plugin UI as a tag?

You can send it as a Uint8Array in your postMessage to the plugin UI.

Thank you @ntfromchicago, my issue is more with promises now.
How to save multiple uint8Array (async calls) data and pass that back to the UI.

Once the Uint8Array is in the plugin UI, how do i decode it back into an image? I assume converting it to a base64 image/png would work but everything I’ve tried throws errors

image = btoa(utf8decoder.decode(event.data.pluginMessage["image"]));

in this case the error i get is “btoa doesn’t exist”

This is how i got it working in the end:

var myArray = event.data.pluginMessage["image"]; //= your data in a UInt8Array
var blob = new Blob([myArray], {'type': 'image/png'});

var reader = new FileReader();
reader.onload = function(e) {
    // do what you need with the image here
};
reader.readAsDataURL(blob);
1 Like

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.