# Change list icon

**URL:** <https://community.glideapps.com/t/change-list-icon/23423>\
**Category:** Ask for Help\
**Created:** [February 25, 2021, 3:08pm UTC](https://community.glideapps.com/t/change-list-icon/23423 "2021-02-25T15:08:17Z")\
**Posts on this page:** 13\
**Page:** 1

<div class="post-metadata">

**Author:** ![Fabio\_Leanzi](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/fabio_leanzi/32/6838_2.png) [@Fabio\_Leanzi](https://community.glideapps.com/u/Fabio_Leanzi)\
**Post date:** [February 25, 2021, 3:08pm UTC](https://community.glideapps.com/t/change-list-icon/23423/1 "2021-02-25T15:08:17Z")

</div>

Hi,  
is possibile to change the list icon?

 ![Schermata 2021-02-25 alle 16.06.22](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/3/c/3c92911fe09d071d638be739719a775d3c1ae712.png)  
I would need it like this, but if I have multiple action I can’t put it.  
 ![Schermata 2021-02-25 alle 16.08.00](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/9/4/94b58444773ef0a7d7bc33cd7b293b9febc58cd0.png)

---

<div class="post-metadata">

**Author:** ![Fabio\_Leanzi](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/fabio_leanzi/32/6838_2.png) [@Fabio\_Leanzi](https://community.glideapps.com/u/Fabio_Leanzi)\
**Post date:** [February 25, 2021, 3:41pm UTC](https://community.glideapps.com/t/change-list-icon/23423/2 "2021-02-25T15:41:29Z")

</div>

ok solved 🙂

 ![Schermata 2021-02-25 alle 16.41.05](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/f/5/f581c6dbf3f8813519fd31e5225b3d4e5cccf834.png)

---

<div class="post-metadata">

**Author:** ![Pablo\_books](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/pablo_books/32/2110_2.png) [@Pablo\_books](https://community.glideapps.com/u/Pablo_books)\
**Post date:** [February 25, 2021, 4:02pm UTC](https://community.glideapps.com/t/change-list-icon/23423/3 "2021-02-25T16:02:17Z")

</div>

Out of curiosity, how did you solve this?

---

<div class="post-metadata">

**Author:** ![Fabio\_Leanzi](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/fabio_leanzi/32/6838_2.png) [@Fabio\_Leanzi](https://community.glideapps.com/u/Fabio_Leanzi)\
**Post date:** [February 25, 2021, 4:13pm UTC](https://community.glideapps.com/t/change-list-icon/23423/4 "2021-02-25T16:13:33Z")

</div>

with this is the code:

.kRqima .navigationIcon { color: rgb(153, 153, 153, 0); width: 24px; height: 24px; min-width: 24px; transform: translateX(8px); display: flex; -webkit-box-pack: center; justify-content: center; -webkit-box-align: center; align-items: center; background-image: url(https://i.ibb.co/jT6v5pR/meno.png); background-size: 24px; margin-right: 10px; }

---

<div class="post-metadata">

**Author:** ![CESI](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/cesi/32/4919_2.png) [@CESI](https://community.glideapps.com/u/CESI)\
**Post date:** [February 25, 2021, 4:31pm UTC](https://community.glideapps.com/t/change-list-icon/23423/5 "2021-02-25T16:31:12Z")

</div>

Nice!

I was just going to add the code I did for something similar, but looks like you figured it out already. Just note that “.kRqima” may change on you at some point, I know those dynamic style names change randomly on me sometimes. You could probably leave it out if it’s the only list on that page.

For reference, the custom CSS code needs to be pasted into a Rich Text Control. The code below changes them to red X’s for delete actions.

> \<span\>\<pre\>\<style\>  
> .navigationIcon::before{  
> content:‘✖’;  
> font-weight: 500;  
> color: red;  
> }  
> .navigationIcon svg{  
> opacity: 0;  
> }  
> \</style\>\</pre\>\</span\>

---

<div class="post-metadata">

**Author:** ![Fabio\_Leanzi](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/fabio_leanzi/32/6838_2.png) [@Fabio\_Leanzi](https://community.glideapps.com/u/Fabio_Leanzi)\
**Post date:** [February 25, 2021, 5:03pm UTC](https://community.glideapps.com/t/change-list-icon/23423/6 "2021-02-25T17:03:09Z")

</div>

> [@CESI](#):
>
> ‘✖’

Oh tnx 🙂

---

<div class="post-metadata">

**Author:** ![Gdclavijo](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/gdclavijo/32/13069_2.png) [@Gdclavijo](https://community.glideapps.com/u/Gdclavijo)\
**Post date:** [February 26, 2021, 1:30am UTC](https://community.glideapps.com/t/change-list-icon/23423/7 "2021-02-26T01:30:56Z")

</div>

@Fabio_Leanzi @CESI … sorry guys !!! 🙄 one question… How can I include the CSS code to convert the symbol so in item list I’m not found the option to include it. I’ll appreciate so much your comments. Thanks.

---

<div class="post-metadata">

**Author:** ![Darren\_Murphy](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/darren_murphy/32/47326_2.png) [@Darren\_Murphy](https://community.glideapps.com/u/Darren_Murphy)\
**Post date:** [February 26, 2021, 1:49am UTC](https://community.glideapps.com/t/change-list-icon/23423/8 "2021-02-26T01:49:29Z")

</div>

Use it in a Rich Text component.

---

<div class="post-metadata">

**Author:** ![Gdclavijo](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/gdclavijo/32/13069_2.png) [@Gdclavijo](https://community.glideapps.com/u/Gdclavijo)\
**Post date:** [February 26, 2021, 1:57am UTC](https://community.glideapps.com/t/change-list-icon/23423/9 "2021-02-26T01:57:51Z")

</div>

Thanks… @Darren_Murphy Darren… so, I’m trying to include the code sent by @Fabio_Leanzi and @CESI but I don’t see any changes… sure, it is possible that I’m doing wrong… thanks… 😉 …

---

<div class="post-metadata">

**Author:** ![Darren\_Murphy](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/darren_murphy/32/47326_2.png) [@Darren\_Murphy](https://community.glideapps.com/u/Darren_Murphy)\
**Post date:** [February 26, 2021, 2:06am UTC](https://community.glideapps.com/t/change-list-icon/23423/10 "2021-02-26T02:06:24Z")

</div>

It’s quite possible that the class/style names that you have are not matching those in the examples.  
The only way to confirm that would be by using dev tools to inspect the source code of your app.

These CSS methods are not officially supported by Glide, so there is never any guarantee that they will work, or continue to work.

---

<div class="post-metadata">

**Author:** ![Gdclavijo](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/gdclavijo/32/13069_2.png) [@Gdclavijo](https://community.glideapps.com/u/Gdclavijo)\
**Post date:** [February 26, 2021, 2:11am UTC](https://community.glideapps.com/t/change-list-icon/23423/11 "2021-02-26T02:11:41Z")

</div>

Thanks for your your explanation … very helpful because I never had used CSS Code (rich text component)… thanks again @Darren_Murphy 👍 👍

---

<div class="post-metadata">

**Author:** ![Silvio\_Rebelo](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/silvio_rebelo/32/12029_2.png) [@Silvio\_Rebelo](https://community.glideapps.com/u/Silvio_Rebelo)\
**Post date:** [February 26, 2021, 4:10am UTC](https://community.glideapps.com/t/change-list-icon/23423/12 "2021-02-26T04:10:54Z")

</div>

It looks like the **code** is haunting… Again

---

<div class="post-metadata">

**Author:** ![Fabio\_Leanzi](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/fabio_leanzi/32/6838_2.png) [@Fabio\_Leanzi](https://community.glideapps.com/u/Fabio_Leanzi)\
**Post date:** [February 26, 2021, 8:46am UTC](https://community.glideapps.com/t/change-list-icon/23423/13 "2021-02-26T08:46:13Z")

</div>

you can try this code

[https://justpaste.it/3ez6z](https://justpaste.it/3ez6z)
