# Icons as button labels Basic UI

**URL:** <https://community.openhab.org/t/icons-as-button-labels-basic-ui/32612>\
**Category:** UIs\
**Tags:** icons, basicui\
**Created:** [August 2, 2017, 12:40pm UTC](https://community.openhab.org/t/icons-as-button-labels-basic-ui/32612 "2017-08-02T12:40:01Z")\
**Posts on this page:** 10\
**Page:** 1

<div class="post-metadata">

**Author:** ![MaxvandeLaar](https://community.openhab.org/letter_avatar_proxy/v4/letter/m/977dab/32.png) [@MaxvandeLaar](https://community.openhab.org/u/MaxvandeLaar)\
**Post date:** [August 2, 2017, 12:40pm UTC](https://community.openhab.org/t/icons-as-button-labels-basic-ui/32612/1 "2017-08-02T12:40:01Z")

</div>

Hi openHab Community,

I’m a relatively new openHab user and I was working on my first sitemap when something really bothered me in Basic UI. My buttons looked dull and only had text in them.

I am unsure if there is already something around that does this, however, I still wanted to share it. (Maybe someone knows a better solution). I managed to include Font-Awesome and Material Icons.

The result  
 ![image](https://community-openhab-org.s3.dualstack.eu-central-1.amazonaws.com/optimized/3X/c/9/c9a9fe3624ffc7a465c692165f7a66928f8c89f8_2_345x30.png)

The only downside as of now is that I somehow disabled the ripple effect.

If someone wants to use it you can find my script on GitHub (I will probably keep improving it) [GitHub - MaxvandeLaar/OH2-BasicUI-Icons: Use icons as button labels instead of plain text.](https://github.com/MaxvandeLaar/OH2-BasicUI-Icons)

---

<div class="post-metadata">

**Author:** ![ThomDietrich](https://community.openhab.org/user_avatar/community.openhab.org/thomdietrich/32/71239_2.png) [@ThomDietrich](https://community.openhab.org/u/ThomDietrich)\
**Post date:** [August 2, 2017, 1:04pm UTC](https://community.openhab.org/t/icons-as-button-labels-basic-ui/32612/2 "2017-08-02T13:04:20Z")

</div>

That’s pretty nice! Did you consider contributing the addition as a BasicUI improvement?

---

<div class="post-metadata">

**Author:** ![MaxvandeLaar](https://community.openhab.org/letter_avatar_proxy/v4/letter/m/977dab/32.png) [@MaxvandeLaar](https://community.openhab.org/u/MaxvandeLaar)\
**Post date:** [August 2, 2017, 1:15pm UTC](https://community.openhab.org/t/icons-as-button-labels-basic-ui/32612/3 "2017-08-02T13:15:53Z")

</div>

Thanks.  
I would love to be a part of the community and use my skills to help improve the UI. However, I cannot find how to do that yet. I still need to find my way around the openHab components and how to contribute. If you could point me into the right direction I would be very thankful.

---

<div class="post-metadata">

**Author:** ![ThomDietrich](https://community.openhab.org/user_avatar/community.openhab.org/thomdietrich/32/71239_2.png) [@ThomDietrich](https://community.openhab.org/u/ThomDietrich)\
**Post date:** [August 2, 2017, 1:56pm UTC](https://community.openhab.org/t/icons-as-button-labels-basic-ui/32612/4 "2017-08-02T13:56:52Z")

</div>

I totally understand your problem. It takes a few minutes to understand how the openHAB world is characterized.  
The Basic UI is developed under the Eclipse Smart Home project and I’d suggest to present your idea there.Specifically I’d suggest to present your current solution and ask for guidance on how to implement this as a native function in an Issue Ticket here:

- [GitHub · Where software is built](https://github.com/eclipse/smarthome/issues?q=is%3Aissue+is%3Aopen+label%3AUI-BasicUI)

Please post the link to the created issue here, so we can follow along 😉 Thanks

Be sure to make your vision and open questions clear. It is often easy to understand a new idea wrong and you don’t want the discussion sidetracked because one commenter understood e.g. you want to introduce a totally new sitemap element… 😉 Defining open questions helps to start a discussion in the right direction.

Welcome to the openHAB developer commuity!! 🍻 🎉

---

<div class="post-metadata">

**Author:** ![MaxvandeLaar](https://community.openhab.org/letter_avatar_proxy/v4/letter/m/977dab/32.png) [@MaxvandeLaar](https://community.openhab.org/u/MaxvandeLaar)\
**Post date:** [August 3, 2017, 7:24pm UTC](https://community.openhab.org/t/icons-as-button-labels-basic-ui/32612/5 "2017-08-03T19:24:54Z")

</div>

Thank you, I will definitely do that!

---

<div class="post-metadata">

**Author:** ![Bernd\_Ritter](https://community.openhab.org/letter_avatar_proxy/v4/letter/b/71c47a/32.png) [@Bernd\_Ritter](https://community.openhab.org/u/Bernd_Ritter)\
**Post date:** [July 8, 2020, 8:28pm UTC](https://community.openhab.org/t/icons-as-button-labels-basic-ui/32612/6 "2020-07-08T20:28:56Z")

</div>

So what happened to this? I am currently looking for a way how to get icons on my buttons…

---

<div class="post-metadata">

**Author:** ![rossko57](https://community.openhab.org/user_avatar/community.openhab.org/rossko57/32/70263_2.png) [@rossko57](https://community.openhab.org/u/rossko57)\
**Post date:** [July 8, 2020, 8:35pm UTC](https://community.openhab.org/t/icons-as-button-labels-basic-ui/32612/7 "2020-07-08T20:35:53Z")

</div>

There has been no such development in BasicUI.

Sometimes this cab be used instead

> [@Spice up fire your sitemap with unicode symbols flexed\_bicepscat\_face](https://community.openhab.org/t/spice-up-your-sitemap-with-unicode-symbols/13866):
>
> Make data displayed on your sitemap more visual by adding unicode symbols to it. They can be used in all visible strings, be it in labels, rules, transformations,… The only limitation is, that your UI font needs to support the symbol. With BasicUI and the Android or iPhone font that’s mostly the case but you’ll need to give it a try. [http://charmap.de](http://charmap.de) (german) [Unicode/List of useful symbols - Wikibooks, open books for an open world](https://en.wikibooks.org/wiki/Unicode/List_of_useful_symbols)[http://unicode.scarfboy.com](http://unicode.scarfboy.com)[http://emojipedia.org](http://emojipedia.org) Example …

---

<div class="post-metadata">

**Author:** ![MaxvandeLaar](https://community.openhab.org/letter_avatar_proxy/v4/letter/m/977dab/32.png) [@MaxvandeLaar](https://community.openhab.org/u/MaxvandeLaar)\
**Post date:** [July 9, 2020, 6:48am UTC](https://community.openhab.org/t/icons-as-button-labels-basic-ui/32612/8 "2020-07-09T06:48:34Z")

</div>

@Bernd_Ritter, I actually switched from openhab to Homey. This made more sense to me as I am a JS developer and my Java development skills are limited to same basic back-end and api work. I found it too complicated to contribute to openHab but I am unsure if this still is the case.

---

<div class="post-metadata">

**Author:** ![christoph\_wempe](https://community.openhab.org/user_avatar/community.openhab.org/christoph_wempe/32/70848_2.png) [@christoph\_wempe](https://community.openhab.org/u/christoph_wempe)\
**Post date:** [August 5, 2020, 9:20pm UTC](https://community.openhab.org/t/icons-as-button-labels-basic-ui/32612/9 "2020-08-05T21:20:01Z")

</div>

I just thought about the same thing and stumbled upon this post.

Too bad it did not get integrated. ☹

I actually thought it would be cool if you could use fontawesome icons as item icons as well.

Where should I create a feature request for this?

I am confused about the different openhab repositories every time. 😕

---

<div class="post-metadata">

**Author:** ![droid](https://community.openhab.org/user_avatar/community.openhab.org/droid/32/57424_2.png) [@droid](https://community.openhab.org/u/droid)\
**Post date:** [August 15, 2020, 6:21pm UTC](https://community.openhab.org/t/icons-as-button-labels-basic-ui/32612/10 "2020-08-15T18:21:47Z")

</div>

Came to that one as well. It would be awesome if we could get fontawesome integrated. The basic icons are just ugly.
