# Display image from API respnse **URL:** \ **Category:** Questions about Thunkable X\ **Tags:** image, webapi\ **Created:** [October 16, 2018, 5:08pm UTC](https://community.thunkable.com/t/display-image-from-api-respnse/52209 "2018-10-16T17:08:51Z")\ **Posts on this page:** 7\ **Page:** 1
**Author:** ![Michael\_Mckenna](https://avatars.discourse-cdn.com/v4/letter/m/aca169/32.png) [@Michael\_Mckenna](https://community.thunkable.com/u/Michael_Mckenna)\ **Post date:** [October 16, 2018, 5:08pm UTC](https://community.thunkable.com/t/display-image-from-api-respnse/52209/1 "2018-10-16T17:08:51Z")
I make a custom API call to my own server where the response is a json with some data and an image that I want to display on the screen. How should I send the image to the app, and how do I parse it to display app-side? Currently sending as image bytes b64 and utf-8 encoded. Thanks! ---
**Author:** ![actech](https://avatars.discourse-cdn.com/v4/letter/a/3d9bf3/32.png) [@actech](https://community.thunkable.com/u/actech)\ **Post date:** [October 16, 2018, 6:43pm UTC](https://community.thunkable.com/t/display-image-from-api-respnse/52209/2 "2018-10-16T18:43:30Z")
Try a tip from here, where it is suggested to transfer the image in base64. > [@Use base64 encoded images](http://community.thunkable.com/t/use-base64-encoded-images/35254): > > Thunkable X components can display images encoded in base64 format. To do this, enter the data in this format in the URL or file name input field, for example: data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAMAAAAoLQ9TAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAwBQTFRF7c5J78kt+/Xm78lQ6stH5LI36bQh6rcf7sQp671G89ZZ8c9V8c5U9+u27MhJ/Pjv9txf8uCx57c937Ay5L1n58Nb67si8tVZ5sA68tJX/Pfr7dF58tBG9d5e8+Gc6chN6LM+7spN1pos6rYs6L8+47hE7cNG6bQc9uFj7sMn4rc17cMx3atG8duj+O7B686H7cAl7cEm7sRM26cq/vz… ---
**Author:** ![Michael\_Mckenna](https://avatars.discourse-cdn.com/v4/letter/m/aca169/32.png) [@Michael\_Mckenna](https://community.thunkable.com/u/Michael_Mckenna)\ **Post date:** [October 17, 2018, 4:39am UTC](https://community.thunkable.com/t/display-image-from-api-respnse/52209/3 "2018-10-17T04:39:49Z")
Thanks actech for the link, very helpful! I think I have it working, except that my data is encoded both in base64 then in utf-8, do you know how I can decode the utf-8 before using the base64 data? ---
**Author:** ![actech](https://avatars.discourse-cdn.com/v4/letter/a/3d9bf3/32.png) [@actech](https://community.thunkable.com/u/actech)\ **Post date:** [October 17, 2018, 8:07am UTC](https://community.thunkable.com/t/display-image-from-api-respnse/52209/4 "2018-10-17T08:07:29Z")
There are many online services for decoding utf-8 to base64. [https://www.motobit.com/util/base64-decoder-encoder.asp?charset=utf-8](https://www.motobit.com/util/base64-decoder-encoder.asp?charset=utf-8) [https://calcus.ru/base64](https://calcus.ru/base64) > **[Base64 Decode and Encode - Online](https://www.base64decode.org/)** > > Decode from Base64 or Encode to Base64 - Here, with our simple online tool. ---
**Author:** ![Michael\_Mckenna](https://avatars.discourse-cdn.com/v4/letter/m/aca169/32.png) [@Michael\_Mckenna](https://community.thunkable.com/u/Michael_Mckenna)\ **Post date:** [October 17, 2018, 4:43pm UTC](https://community.thunkable.com/t/display-image-from-api-respnse/52209/5 "2018-10-17T16:43:34Z")
Thanks for the links, I am hoping to decode all in app as the image will change with each server call, these links don’t seem to have an api as an option. Something is happening in my app where the image is being set to a blank image (the container grows, but its blank) just using the “join” block for "data: image/png; base64, " and the image bytes string from the call to my server. Did I structure the string correctly? ---
**Author:** ![actech](https://avatars.discourse-cdn.com/v4/letter/a/3d9bf3/32.png) [@actech](https://community.thunkable.com/u/actech)\ **Post date:** [October 17, 2018, 5:41pm UTC](https://community.thunkable.com/t/display-image-from-api-respnse/52209/6 "2018-10-17T17:41:49Z")
API Base64 that would be great! You understand the structure correctly. Some services can generate a string completely, starting with data: ---
**Author:** ![ioannis](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/ioannis/32/146956_2.png) [@ioannis](https://community.thunkable.com/u/ioannis)\ **Post date:** [November 8, 2024, 11:55am UTC](https://community.thunkable.com/t/display-image-from-api-respnse/52209/7 "2024-11-08T11:55:02Z")