# Material-icon in annotation

**URL:** <https://community.plotly.com/t/material-icon-in-annotation/79728>\
**Category:** Dash Python\
**Created:** [October 30, 2023, 8:25pm UTC](https://community.plotly.com/t/material-icon-in-annotation/79728 "2023-10-30T20:25:55Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![nickhes](https://sea2.discourse-cdn.com/flex024/user_avatar/community.plotly.com/nickhes/32/21517_2.png) [@nickhes](https://community.plotly.com/u/nickhes)\
**Post date:** [October 30, 2023, 8:25pm UTC](https://community.plotly.com/t/material-icon-in-annotation/79728/1 "2023-10-30T20:25:55Z")

</div>

I am trying to add a logo to the annotation. Unfortunately, it shows as text instead of icon. Is there way to change that?

annotations = [dict(  
align=‘center’,  
xref=“paper”,  
yref=“paper”,  
showarrow=False,  
font=dict(  
family=“Courier New, monospace”,  
size=26,  
color=“#ffffff”  
),  
text=“Gender _gender_”,  
)]

---

<div class="post-metadata">

**Author:** ![AIMPED](https://sea2.discourse-cdn.com/flex024/user_avatar/community.plotly.com/aimped/32/21758_2.png) [@AIMPED](https://community.plotly.com/u/AIMPED)\
**Post date:** [October 31, 2023, 9:10am UTC](https://community.plotly.com/t/material-icon-in-annotation/79728/2 "2023-10-31T09:10:25Z")

</div>

It depends on the icon you want to show. Maybe unicode icons are an option for you:

> [@I want to use custom icon for the scatter markers. How to do it?](https://community.plotly.com/t/i-want-to-use-custom-icon-for-the-scatter-markers-how-to-do-it/6644/6):
>
> Hi, one very easy solution is to use UTF-8 icons. This will expand the ‘nomal’ plotly markers by a lot slight_smile UTF-8 res: [https://www.compart.com/de/unicode/search?q=bell#characters](https://www.compart.com/de/unicode/search?q=bell#characters) Plotly.plot('graph', [{ mode: 'text', x: [1], y: [1], text: ['soccer'], type: 'scatter', textfont: { size: 25, color: 'black' } }]) You can easily exchange them. I havn’t found out yet, if using a custom created font also allows to use own icons. I made a codepen for that: [https://codepen.…](https://codepen.io/cherzog/pen/YzqBNvx?editors=0010)
