is doesnt work anymore is there any alternative available?

Sorry, I can’t confirm this. I just tested this on my end and everything works as expected.

Doesn’t work for me either, stopped working after a page refresh. It was working for me before.

Could you show the embed code?

interesting… it seems to be working again for now. I’d prefer not to share embed as it contains some sensitive information. I had tried both methods above but the only one that works for me is adding “%26hide-ui%3D1” to the end of the URL. Thanks for the response

May I ask what does %26hide-ui%3D1 means?

@Sabrina10,

This is awesome. Thanks so much for sharing @tank666!

Without going through the major hassle of using a personal access token and fetching the nodes for each image, etc. and then displaying them accordingly on a site… is there any simple way to show a Figma image on a website and if you change that Figma image, it then changes on the website (without the canvas/UI elements…JUST the image itself).

None of the above work as I’ve tried all of them. The only way I could do it is with quite a bit of custom code because it seems they do store images on AWS for example: https://figma-alpha-api.s3.us-west-2.amazonaws.com/images/5bf61610-63d2-4ae6-8b75-2626d85504fc but I want to be able to ALTER that image and keep the same URL which doesn’t seem to be easily done unless you do something like this coupled with HTML that corresponds:

// Your Figma File ID

const fileId = ‘XXXXXXXXXXXXX’;

// Your Personal Access Token

const personalAccessToken = 'figd_X’XXXXXXXXXXXXXXXXXXX;

// An array of node IDs for the specific frames or objects you want to get the images for

const nodeIds = n‘65:3’, ‘75:14’]; // Add more node IDs as needed

// Fetch the image URLs from Figma for multiple nodes

async function fetchImagesFromFigma() {

const url = https://api.figma.com/v1/images/${fileId}?ids=${nodeIds.join(',')}&format=png;

try {

const response = await fetch(url, {

method: ‘GET’,

headers: {

‘X-Figma-Token’: personalAccessToken

}

});

if (!response.ok) {

  throw new Error(`Failed to fetch images from Figma (status ${response.status})`);

}



const data = await response.json();



// Assuming you want to embed the images in <img> tags with IDs corresponding to node IDs

nodeIds.forEach(nodeId => {

  if (data.images && data.images.nodeId]) {

    document.getElementById(nodeId).src = data.imagesBnodeId];

  } else {

    console.error(`Image not found for node ID ${nodeId} in response data:`, data);

  }

});

} catch (error) {

console.error(‘Error fetching images from Figma:’, error);

}

}

// Call the function to fetch and display the images

fetchImagesFromFigma();

This is great! Thanks so much for this!! 🙂