# Displaying an image in dashboard from a Url

**URL:** <https://discourse.nodered.org/t/displaying-an-image-in-dashboard-from-a-url/27912>\
**Category:** Dashboard\
**Created:** [6 June 2020 18:44 UTC](https://discourse.nodered.org/t/displaying-an-image-in-dashboard-from-a-url/27912 "2020-06-06T18:44:46Z")\
**Posts on this page:** 1\
**Showing post:** 5

<div class="post-metadata">

**Author:** ![Steve-Mcl](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/steve-mcl/32/4826_2.png) [@Steve-Mcl](https://discourse.nodered.org/u/Steve-Mcl)\
**Post date:** [7 June 2020 10:15 UTC](https://discourse.nodered.org/t/displaying-an-image-in-dashboard-from-a-url/27912/5 "2020-06-07T10:15:53Z")

</div>

> [@evanic14](#):
>
> I also installed another library which is called: node-red-contrib-image-simple-node. This library can convert the URL to a image, but I can't send it to my dashboard.

If you use `node-red-contrib-image-tools` it can grab an image from internet, convert to base64 & then you simply inject that into a ui\_template

![3n0vvlpEGJ](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/3/2/322b5fda210da3504c1d839a1edbf7e16e791d47.gif)

![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/4/e/4e028aa6b0e159e0f384f8af198aa871296a44a7.png)

```auto
[{"id":"39d92325.5b31ec","type":"jimp-image","z":"da4f1a2d.d31008","name":"Kitten from placekitten.com","data":"http://placekitten.com/300/300","dataType":"str","ret":"b64","parameter1":"","parameter1Type":"msg","parameter2":"","parameter2Type":"msg","parameter3":"","parameter3Type":"msg","parameter4":"","parameter4Type":"msg","parameter5":"","parameter5Type":"msg","parameter6":"","parameter6Type":"msg","parameter7":"","parameter7Type":"msg","parameter8":"","parameter8Type":"msg","parameterCount":0,"jimpFunction":"none","selectedJimpFunction":{"name":"none","fn":"none","description":"Just loads the image.","parameters":[]},"x":260,"y":120,"wires":[["2d9d272a.787cb8","a5ecda5c.164c28","7f9bc166.833c3"]]},{"id":"2d9d272a.787cb8","type":"image viewer","z":"da4f1a2d.d31008","name":"","width":"200","data":"payload","dataType":"msg","x":510,"y":140,"wires":[[]]},{"id":"4ce2fac6.848174","type":"ui_button","z":"da4f1a2d.d31008","name":"","group":"7de23636.088a88","order":1,"width":0,"height":0,"passthru":false,"label":"Get Image from internet","tooltip":"","color":"","bgcolor":"","icon":"","payload":"","payloadType":"str","topic":"","x":220,"y":60,"wires":[["39d92325.5b31ec"]]},{"id":"a5ecda5c.164c28","type":"debug","z":"da4f1a2d.d31008","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"false","x":480,"y":60,"wires":[]},{"id":"d615e8d1.844438","type":"ui_template","z":"da4f1a2d.d31008","group":"7de23636.088a88","name":"ui template","order":1,"width":"6","height":"5","format":"<div ng-bind-html=\"msg.payload\"></div>","storeOutMessages":false,"fwdInMessages":true,"resendOnRefresh":false,"templateScope":"local","x":690,"y":100,"wires":[[]]},{"id":"7f9bc166.833c3","type":"template","z":"da4f1a2d.d31008","name":"","field":"payload","fieldType":"msg","format":"handlebars","syntax":"mustache","template":"<img width=\"160px\" height=\"160px\" src=\"{{{payload}}}\">","output":"str","x":520,"y":100,"wires":[["d615e8d1.844438"]]},{"id":"7de23636.088a88","type":"ui_group","z":"","name":"Default","tab":"59c1a803.3cb648","order":1,"disp":true,"width":"6","collapse":false},{"id":"59c1a803.3cb648","type":"ui_tab","z":"","name":"Home","icon":"dashboard","disabled":false,"hidden":false}]

```

---

_[View the full topic](https://discourse.nodered.org/t/displaying-an-image-in-dashboard-from-a-url/27912)._