# Group colour (icon), how is it working?

**URL:** <https://discourse.jabref.org/t/group-colour-icon-how-is-it-working/659>\
**Category:** Help\
**Tags:** groups\
**Created:** [June 10, 2017, 9:08am UTC](https://discourse.jabref.org/t/group-colour-icon-how-is-it-working/659 "2017-06-10T09:08:56Z")\
**Posts on this page:** 20\
**Page:** 1

<div class="post-metadata">

**Author:** ![bkleine](https://yyz2.discourse-cdn.com/flex030/user_avatar/discourse.jabref.org/bkleine/32/428_2.png) [@bkleine](https://discourse.jabref.org/u/bkleine)\
**Post date:** [June 10, 2017, 9:08am UTC](https://discourse.jabref.org/t/group-colour-icon-how-is-it-working/659/1 "2017-06-10T09:08:56Z")

</div>

In the Edit Group dialogue, there is a field color. By assigning a text “blue” to that field I noticed that the color stored in the field is 0X0000ffff, i.e. hexadicimal representation. But either the group nor entries in it appear colored or with colored background. What is then the color doing? I am confused. In the documentation there is not any mentioning of group colors nor of the icon field. Would you be please so kind to explain it in the documentation that a simple minded person as myself can see the benefit of color and icons for a group?

---

<div class="post-metadata">

**Author:** ![Siedlerchr](https://yyz2.discourse-cdn.com/flex030/user_avatar/discourse.jabref.org/siedlerchr/32/216_2.png) [@Siedlerchr](https://discourse.jabref.org/u/Siedlerchr)\
**Post date:** [June 11, 2017, 7:25pm UTC](https://discourse.jabref.org/t/group-colour-icon-how-is-it-working/659/2 "2017-06-11T19:25:00Z")

</div>

This is a new feature of the version 4 groups.

In the Icon field you should be able to set one of these icons from these icon-fonts like material design. @tobiasdiez for sure knows exactly what you have to enter there.

And the color field sets the color of the field.

I could not yet figure out how to display an icon, but you can enter there some text and if you type “orange” (without quotation marks) in the color field, the text will be displayed in orange.

The changes appear when you expand/unexpand the groups once.

![](https://canada1.discourse-cdn.com/flex030/uploads/jabref/original/1X/2b1b9a5b770706a4dd3d96e53c863b72e4e827ec.png)

---

<div class="post-metadata">

**Author:** ![bkleine](https://yyz2.discourse-cdn.com/flex030/user_avatar/discourse.jabref.org/bkleine/32/428_2.png) [@bkleine](https://discourse.jabref.org/u/bkleine)\
**Post date:** [June 11, 2017, 8:14pm UTC](https://discourse.jabref.org/t/group-colour-icon-how-is-it-working/659/3 "2017-06-11T20:14:07Z")

</div>

I had yesterday labeled the group “Adiponectin” green which goes to 0x0000ffff. However neither closing the groups “05 hormones” nor the group “Adipokines” rendered the group “Adiponectin” green.

Obviously not yet working properly.

 ![](https://canada1.discourse-cdn.com/flex030/uploads/jabref/original/1X/80c1bdd4a6a8825822ef34661cdd72a201e5b55e.png)

---

<div class="post-metadata">

**Author:** ![tobiasdiez](https://yyz2.discourse-cdn.com/flex030/user_avatar/discourse.jabref.org/tobiasdiez/32/340_2.png) [@tobiasdiez](https://discourse.jabref.org/u/tobiasdiez)\
**Post date:** [June 11, 2017, 8:35pm UTC](https://discourse.jabref.org/t/group-colour-icon-how-is-it-working/659/4 "2017-06-11T20:35:25Z")

</div>

You have to specify the color **and** an icon. The icon code is one of the unicodes of the [material design icon font](https://github.com/Jerady/fontawesomefx-jigsaw-modules/blob/master/src/de.jensd.fx.glyphs.materialdesignicons/de/jensd/fx/glyphs/materialdesignicons/MaterialDesignIcon.java), e.g. `\uf002`. Of course the input is not yet very user friendly and will be improved as part of [https://github.com/JabRef/jabref/pull/2643](https://github.com/JabRef/jabref/pull/2643).

---

<div class="post-metadata">

**Author:** ![bkleine](https://yyz2.discourse-cdn.com/flex030/user_avatar/discourse.jabref.org/bkleine/32/428_2.png) [@bkleine](https://discourse.jabref.org/u/bkleine)\
**Post date:** [June 18, 2017, 4:14pm UTC](https://discourse.jabref.org/t/group-colour-icon-how-is-it-working/659/5 "2017-06-18T16:14:52Z")

</div>

Is this the intended behaviour?

![](https://canada1.discourse-cdn.com/flex030/uploads/jabref/original/1X/0763242bf8aa911f6b39c3d4b9078af17c5010c3.png)

both, \uf1a2 or \uf002 are from the material design icon font, obviously the icon font is not known to Jabref or what do I miss

---

<div class="post-metadata">

**Author:** ![Siedlerchr](https://yyz2.discourse-cdn.com/flex030/user_avatar/discourse.jabref.org/siedlerchr/32/216_2.png) [@Siedlerchr](https://discourse.jabref.org/u/Siedlerchr)\
**Post date:** [June 19, 2017, 2:17pm UTC](https://discourse.jabref.org/t/group-colour-icon-how-is-it-working/659/6 "2017-06-19T14:17:35Z")

</div>

Hm,

I experienced the same. I will see if I can find out where the problem is. The font is known and is used in other areas.

---

<div class="post-metadata">

**Author:** ![tobiasdiez](https://yyz2.discourse-cdn.com/flex030/user_avatar/discourse.jabref.org/tobiasdiez/32/340_2.png) [@tobiasdiez](https://discourse.jabref.org/u/tobiasdiez)\
**Post date:** [June 19, 2017, 3:42pm UTC](https://discourse.jabref.org/t/group-colour-icon-how-is-it-working/659/7 "2017-06-19T15:42:12Z")

</div>

It should work if you specify the icon as a [single unicode character](https://en.wikipedia.org/wiki/Unicode_input#Selection_from_a_screen).

---

<div class="post-metadata">

**Author:** ![Bernhard\_Kleine](https://avatars.discourse-cdn.com/v4/letter/b/bcef8e/32.png) [@Bernhard\_Kleine](https://discourse.jabref.org/u/Bernhard_Kleine)\
**Post date:** [June 19, 2017, 3:53pm UTC](https://discourse.jabref.org/t/group-colour-icon-how-is-it-working/659/8 "2017-06-19T15:53:47Z")

</div>

|  
|  
|It should work if you specify the icon as a [single unicode  
|character](https://en.wikipedia.org/wiki/Unicode_input#Selection_from_a_screen).  
|  
|  
|  
|

| |
| --- |
| [Visit |
| Topic]([Group colour (icon), how is it working?](http://discourse.jabref.org/t/group-colour-icon-how-is-it-working/659/7)) |
| or reply to this email to respond. |
| |
| To unsubscribe from these emails, [click |
| here]([http://discourse.jabref.org/email/unsubscribe/6e739f9229a4a96c34efcee84fea959c4afa069bb1e3c1d8b88a2440d22e0a30](http://discourse.jabref.org/email/unsubscribe/6e739f9229a4a96c34efcee84fea959c4afa069bb1e3c1d8b88a2440d22e0a30)). |

And please how to do this?

---

<div class="post-metadata">

**Author:** ![Siedlerchr](https://yyz2.discourse-cdn.com/flex030/user_avatar/discourse.jabref.org/siedlerchr/32/216_2.png) [@Siedlerchr](https://discourse.jabref.org/u/Siedlerchr)\
**Post date:** [June 19, 2017, 7:49pm UTC](https://discourse.jabref.org/t/group-colour-icon-how-is-it-working/659/9 "2017-06-19T19:49:13Z")

</div>

I created a little code to handle this better as long as we don’t have a new UI dialog.

[https://github.com/JabRef/jabref/pull/2926](https://github.com/JabRef/jabref/pull/2926)

---

<div class="post-metadata">

**Author:** ![bkleine](https://yyz2.discourse-cdn.com/flex030/user_avatar/discourse.jabref.org/bkleine/32/428_2.png) [@bkleine](https://discourse.jabref.org/u/bkleine)\
**Post date:** [June 20, 2017, 5:48pm UTC](https://discourse.jabref.org/t/group-colour-icon-how-is-it-working/659/10 "2017-06-20T17:48:24Z")

</div>

Please, how to write unicode symbols in the icon field? Obviously \uf1A2 is interpreted as text. Be so king and provide an instruction to write the value \uf1A2 in that field. Everything on my desktop is in utf8.

---

<div class="post-metadata">

**Author:** ![tobiasdiez](https://yyz2.discourse-cdn.com/flex030/user_avatar/discourse.jabref.org/tobiasdiez/32/340_2.png) [@tobiasdiez](https://discourse.jabref.org/u/tobiasdiez)\
**Post date:** [June 20, 2017, 8:59pm UTC](https://discourse.jabref.org/t/group-colour-icon-how-is-it-working/659/11 "2017-06-20T20:59:20Z")

</div>

In the latest development you can now specify the icon using its name, e.g. `FACEBOOK`. It would be really nice if you could update the [help page](https://github.com/JabRef/help.jabref.org/blob/gh-pages/en/Groups.md) in this regard. It is always useful if the help is written from a user perspective and it would also take some stuff off our plate so that we can focus on new features. Thanks.

---

<div class="post-metadata">

**Author:** ![bkleine](https://yyz2.discourse-cdn.com/flex030/user_avatar/discourse.jabref.org/bkleine/32/428_2.png) [@bkleine](https://discourse.jabref.org/u/bkleine)\
**Post date:** [June 23, 2017, 5:54pm UTC](https://discourse.jabref.org/t/group-colour-icon-how-is-it-working/659/12 "2017-06-23T17:54:17Z")

</div>

Hallo, Tobias.  
I would like to help. But at the moment I donot see how.FACEBOOK obviously works, but where are these icons and how to choose from them. It would also be nice to have a dialog to choose the colors and the icons. If such interface is provided I am willing to contribute to the help page.

Regards

---

<div class="post-metadata">

**Author:** ![Siedlerchr](https://yyz2.discourse-cdn.com/flex030/user_avatar/discourse.jabref.org/siedlerchr/32/216_2.png) [@Siedlerchr](https://discourse.jabref.org/u/Siedlerchr)\
**Post date:** [June 24, 2017, 4:00pm UTC](https://discourse.jabref.org/t/group-colour-icon-how-is-it-working/659/13 "2017-06-24T16:00:23Z")

</div>

In the long term we want to improve the GUI dialog interface, which allows you to select the icon and the color.

For now: You can specify any color, e.g. red or green for the icon.  
You can use this tool to look for the icon and their name you want to use:  
On the left you have to select **Material Design Web Font.**

1. Choose your favorite icon, e.g. facebook
2. Enter the correct name of the icon in the group
3. Enter a color name, e.g. blue
4. Collapse/Expand the group tree
5. The new icon is shown in the color

> **[Jerady/fontawesomefx-glyphsbrowser](https://github.com/Jerady/fontawesomefx-glyphsbrowser)**
>
> FontAwesomeFX Glyphsbrowser. Contribute to Jerady/fontawesomefx-glyphsbrowser development by creating an account on GitHub.

---

<div class="post-metadata">

**Author:** ![bkleine](https://yyz2.discourse-cdn.com/flex030/user_avatar/discourse.jabref.org/bkleine/32/428_2.png) [@bkleine](https://discourse.jabref.org/u/bkleine)\
**Post date:** [June 25, 2017, 12:15pm UTC](https://discourse.jabref.org/t/group-colour-icon-how-is-it-working/659/14 "2017-06-25T12:15:32Z")

</div>

> For now: You can specify any color, e.g. red or green for the icon.  
> You can use this tool to look for the icon and their name you want to use:  
> On the left you have to select _Material Design Web Font._

This is the dialogue I have: Snapshot this week  
2017-06-22–master–bee062c6a.exe. No possibility to select the Material  
Design Web Font. What do I miss?

 ![](https://canada1.discourse-cdn.com/flex030/uploads/jabref/original/1X/2b62810367dc7c7c53f7d6751dc720a8bfc40761.png)

---

<div class="post-metadata">

**Author:** ![Siedlerchr](https://yyz2.discourse-cdn.com/flex030/user_avatar/discourse.jabref.org/siedlerchr/32/216_2.png) [@Siedlerchr](https://discourse.jabref.org/u/Siedlerchr)\
**Post date:** [June 25, 2017, 12:37pm UTC](https://discourse.jabref.org/t/group-colour-icon-how-is-it-working/659/15 "2017-06-25T12:37:15Z")

</div>

You have to use the external tool from the link I provided.

There you can look for icons etc. And then you have to enter the name of the selected icon in JabRef’s group dialog.

> **[Jerady/fontawesomefx-glyphsbrowser](https://github.com/Jerady/fontawesomefx-glyphsbrowser)**
>
> FontAwesomeFX Glyphsbrowser. Contribute to Jerady/fontawesomefx-glyphsbrowser development by creating an account on GitHub.

---

<div class="post-metadata">

**Author:** ![matthiasgeiger](https://yyz2.discourse-cdn.com/flex030/user_avatar/discourse.jabref.org/matthiasgeiger/32/7_2.png) [@matthiasgeiger](https://discourse.jabref.org/u/matthiasgeiger)\
**Post date:** [June 25, 2017, 7:07pm UTC](https://discourse.jabref.org/t/group-colour-icon-how-is-it-working/659/16 "2017-06-25T19:07:41Z")

</div>

There is also the possibility to browse the font online using this page here:

[https://materialdesignicons.com/cheatsheet](https://materialdesignicons.com/cheatsheet)

or by using [https://materialdesignicons.com/](https://materialdesignicons.com/) which provides also search functionality, but this is using the newest version of the font which is not used in JabRef and thus not all icons are working…

---

<div class="post-metadata">

**Author:** ![bkleine](https://yyz2.discourse-cdn.com/flex030/user_avatar/discourse.jabref.org/bkleine/32/428_2.png) [@bkleine](https://discourse.jabref.org/u/bkleine)\
**Post date:** [June 27, 2017, 8:57am UTC](https://discourse.jabref.org/t/group-colour-icon-how-is-it-working/659/17 "2017-06-27T08:57:54Z")

</div>

I have tested the cheatsheet website and found that icons like “cake” will work, but icons like “cake-layered” do not… The hyphen is not accepted. Is this intentional or errorneous?

---

<div class="post-metadata">

**Author:** ![bkleine](https://yyz2.discourse-cdn.com/flex030/user_avatar/discourse.jabref.org/bkleine/32/428_2.png) [@bkleine](https://discourse.jabref.org/u/bkleine)\
**Post date:** [June 30, 2017, 5:27pm UTC](https://discourse.jabref.org/t/group-colour-icon-how-is-it-working/659/18 "2017-06-30T17:27:26Z")

</div>

any reaction? Regards Bernhard

---

<div class="post-metadata">

**Author:** ![tobiasdiez](https://yyz2.discourse-cdn.com/flex030/user_avatar/discourse.jabref.org/tobiasdiez/32/340_2.png) [@tobiasdiez](https://discourse.jabref.org/u/tobiasdiez)\
**Post date:** [July 5, 2017, 10:31am UTC](https://discourse.jabref.org/t/group-colour-icon-how-is-it-working/659/19 "2017-07-05T10:31:24Z")

</div>

Maybe it works with underscore.

---

<div class="post-metadata">

**Author:** ![bkleine](https://yyz2.discourse-cdn.com/flex030/user_avatar/discourse.jabref.org/bkleine/32/428_2.png) [@bkleine](https://discourse.jabref.org/u/bkleine)\
**Post date:** [July 7, 2017, 4:58pm UTC](https://discourse.jabref.org/t/group-colour-icon-how-is-it-working/659/20 "2017-07-07T16:58:12Z")

</div>

It does but how are we supposed to know this?

[Next page](https://discourse.jabref.org/t/group-colour-icon-how-is-it-working/659.md?page=2)