# How to Add Images & Logos to a Dashboard!

**URL:** <https://community.omni.co/t/how-to-add-images-logos-to-a-dashboard/307>\
**Category:** Visualizations\
**Tags:** content, dashboards\
**Created:** [April 17, 2025, 4:51pm UTC](https://community.omni.co/t/how-to-add-images-logos-to-a-dashboard/307 "2025-04-17T16:51:38Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![adrienb](https://yyz2.discourse-cdn.com/flex004/user_avatar/community.omni.co/adrienb/32/385_2.png) [@adrienb](https://community.omni.co/u/adrienb)\
**Post date:** [April 17, 2025, 4:51pm UTC](https://community.omni.co/t/how-to-add-images-logos-to-a-dashboard/307/1 "2025-04-17T16:51:38Z")

</div>

Have you ever felt like the one thing missing to really bring a dashboard together is an image or company logo? Well wonder no more, here are three ways to do just that in Omni!

# Method 1 - Simple Static Image

This method is incredibly easy! Simply add a markdown tile to a dashboard, then replace the text with the following line:

`<img src="https://upload.wikimedia.org/wikipedia/commons/d/d4/Hogwarts-Crest.png" alt="Omni Logo" width="400">`

Where the image url needs to be a publicly available file. This can be a great way to add a logo to a company dashboard. One quick aesthetic recommendation, try removing the background of the tile to make the image blend into your dashboard theme (as long as the image has a transparent background)!

 ![Static Image](https://canada1.discourse-cdn.com/flex004/uploads/omni/original/1X/c46c1a187298087cd520e875acdb3ba7db777a8a.png)

# Method 2 - Dynamic Image on Filter Selection

For a slightly more dynamic setup you could have the image respond to user input, such as a filter selection. Here I’ve created a tile that switches the Hogwarts house crest based on the selected student.

![Method 2 - Dynamic Filtering](https://canada1.discourse-cdn.com/flex004/uploads/omni/original/1X/ad8d5b69860c0aba9e1b123e18bb265880746e7a.gif)

This is pretty straightforward to set up as well. First, you’ll need to have the images you want to call stored in a table somewhere. Ideally you have these already in your database, but if not you can easily [upload a CSV or create a blank table](https://docs.omni.co/docs/connections/upload-csvs#create-new-table) like I’ve done here.

 ![Uploading Image Links in CSV](https://canada1.discourse-cdn.com/flex004/uploads/omni/original/1X/68650926c88fa5a7af0a1b2b3ad4ce8e91e68f5b.png)

If the images exist in a table already, you should be able to join them to other tables quite easily. In my case, I used Omni’s [XLOOKUP](https://docs.omni.co/docs/querying-and-sql/table-calculations#xlookup) functionality to have a new tab fetch the correct link based on the Hogwarts house I’m calling in my base table.

 ![Querying Images using XLOOKUP](https://canada1.discourse-cdn.com/flex004/uploads/omni/original/1X/888244dffef7966db5d31359f45fa00757c96576.png)

Then finally in this same query I visualized the results in a markdown chart, where the syntax is very similar to before but now replacing the static link with a reference to the first row in the query.  
`<img src="{{result._first.calc_1.value}}" width="150">`

 ![Visualizing as a Markdown Tile](https://canada1.discourse-cdn.com/flex004/uploads/omni/original/1X/8c93c28eb9af9917a57a2a9841ab2f42ef2c46da.jpeg)

All that’s left to do is put this tile on a dashboard and add a filter on the student name (ideally a single value dropdown). Now by selecting a single student, we ensure that the top row in this query is the student whose house we want to see!

# Method 3 - Dynamic Image on User Attribute

Now let’s say you want the image to be specific to the user accessing the dashboard. For example I can test what a member of Slytherin vs Gryffindor might see.

![Method 3 - Dynamic User Attribute](https://canada1.discourse-cdn.com/flex004/uploads/omni/original/1X/f215707d65b387d6b41821c8edeb50f046ef6e19.gif)

For this we can leverage user attributes, in much the same way that we might partition which users can access specific data. First we’ll [create a new user attribute](https://docs.omni.co/docs/administration/user-attributes#creating-user-attributes) in the Settings page. Then we’ll navigate to a user and set the user attribute value.

 ![Creating User Attribute](https://canada1.discourse-cdn.com/flex004/uploads/omni/original/1X/0e2e29d924bead4891d9a53e41f621136dfa95c6.jpeg)

 ![Setting User Attribute](https://canada1.discourse-cdn.com/flex004/uploads/omni/original/1X/d63f9c9e80f1c13a0562f4190a4e0084bcdc42c4.png)

Then we will navigate to the model file and add an [access filter](https://docs.omni.co/docs/modeling/topics/parameters#access_filters) in the topic file (can also do it at the model level with [default access filters](https://docs.omni.co/docs/modeling/model-files#default_topic_access_filters)). You can interpret this as telling Omni: “when querying the _name_ field from the table called _houses_, ensure the user can only see values that equal their _hogwarts\_house_ user attribute”.

 ![Adding Access Filter to Model](https://canada1.discourse-cdn.com/flex004/uploads/omni/original/1X/2417d325d4824c27a61960e132fe997bf389948c.png)

Now we can build a simple query that has the field used by the user attribute and the image link - you’ll see that Omni dynamically adds a WHERE clause in the SQL query to filter based on the user attribute. Just like in Method 2 we’ve visualized this query with a markdown vis type.

 ![Visualizing User Attribute in SQL](https://canada1.discourse-cdn.com/flex004/uploads/omni/original/1X/3d681d834eaa3862d28ed661b82ab1e002eafb5f.png)

And that’s it! Now try putting this tile on a dashboard, then navigate back to the user attribute and try changing the value - you should see the image change dynamically as you reopen the dashboard!
