Text colours for xml code

Hi to one and all!

Can anyone please advise further upon the different colours available in the firmware code?

I have already discovered some of the basic and obvious colours from the original OSD and other peoples themes which I have listed below-

Grey- 0xaaaaaa, 0x777777- there seems to be a few different shades available for this
Light Blue- 0x07b5ff
Green- 0x91eb00

I have tried using ThumbGen designer to generate some different colours and their respective codes, however this doesn’t seem to work when inserted into the XML code.  Perhaps there is a certain restricted pallette of colours, I don’t know??

However if people have discovered other colours that do work I would be grateful if they could share this?

I am particularly interested in using a light blue and yellow for my Theme i am currently working on.


Any colors will work.

The best thing to do is if you have Photoshop or Gimp and then use the HTML color codes to input the colors.

Just so you know 0x is always the beginning of the code.  So it will always be 0x00000 or 0xfffffff.  The HTML code is always a 6 number code and 0x is just a HUB signifier.

You can also use the HTML color chart HERE.  The 6 numbers in the color is what you will need to use.

So for say yellow it would be 0xffff00, just remember to always start the color with 0x or the color will show but it will not show the correct color.

1 Like

Excellent TW, thanks just what i needed.

Whilst you are on line I have another question to pose

As i said I am working up a theme based upon this Plex skin-


This will be the Gallery view, however when i input a minus value for x in line below-

 <wrapper y=“200” w=“360” h=“220” scale=“100” scale_type=“pan” align=“left”>
<image name=“th0” image="@@browse_0_thumbnail" default_image="@@default_thumbnail_0" x="-250" scale=“100” active="@@act-browselist-0" disable="@@thumbnail_disable_0"/>

It just doesn’t recognise the value and therefore omits the first thumb when running the theme.

Any thoughts or suggestions, providing I have conveyed the problem clearly?

EDIT- forgot that image needs to be vetted any suggestions to upload to host site?

click here- preview


ALSO one other querry-

I’ve been looking in the WDTV ‘User Interface Theme Definitions and Specification’ and found this code


Which would seggest that the text colour can change once selected, however I don’t know were this should be inserted?

I have tried inserting the code as below but this crashed the hub

<wrapper fontsize=“22” w=“450” h=“28” textcolor=“0xffffff” selectedtextcolor= “0x07b55”>

Any thoughts anyone?

@ architectonic

This is the code for highlighted text.   (In my Stage4 ‘List View’ anyways)

In this example: BLACK (0x000000)  is highlighted color, WHITE (0xffffff) is Non-highlighted color.

<wrapper w=“200” h=“22” x=“651” fontsize=“22” align=“left” textcolor=“0xffffff” actnoseltextcolor=“0x000000” actoverlistcolor=“0xffffff” activetextcolor=“0xffffff” selectedtextcolor=“0xffffff”>

1 Like

Thanks for that Joey, will try it out later.

Had noticed this text colour change on your screenshot for stage 4, but wasn’t sure whether this was just your artistic licence or just some very neat theming?

Any how this got me thinking and now you have just shown me the ‘light’ ! :wink:

BTW stage 4 looks progressively kewl as ever Joey.

Thanks again, have some other queries that i’m hoping you or others maybe able to help. will post later as our dog needs walking!!

Back from dog walking but now children need putting to bed. :frowning:

probably post tomorrow.

Although I haven’t been able to do a test, try something like this:

    <wrapper y=“129” w=“360” h=“203” align=“hcenter” scale=“100” scale_type=“fixratio” selected_scale=“100”>
      <image name=“th0” image="@@browse_0_thumbnail" default_image="@@default_thumbnail_0" x="-270" active="@@act-browselist-0"

disable="@@thumbnail_disable_0" />
      <image name=“th1” image="@@browse_1_thumbnail" default_image="@@default_thumbnail_1" x=“95” active="@@act-browselist-1" disable="@@thumbnail_disable_1"

      <image name=“th2” image="@@browse_2_thumbnail" default_image="@@default_thumbnail_2" x=“460” active="@@act-browselist-2" disable="@@thumbnail_disable_2"

      <image name=“th3” image="@@browse_3_thumbnail" default_image="@@default_thumbnail_3" x=“825” active="@@act-browselist-3" disable="@@thumbnail_disable_3"

      <image name=“th4” image="@@browse_4_thumbnail" default_image="@@default_thumbnail_4" x=“1190” active="@@act-browselist-4"

disable="@@thumbnail_disable_4" />
    <wrapper y=“120” w=“394” h=“222” align=“hcenter” scale=“100” scale_type=“fixratio” selected_scale=“100”>
      <image name=“th0_f” image="@@browse_0_thumbnail" default_image="@@default_thumbnail_0" x=“78” active="@@act-browselist-0"

disable="@@thumbnail_f_disable_0" />
      <image name=“th1_f” image="@@browse_1_thumbnail" default_image="@@default_thumbnail_1" x=“78” active="@@act-browselist-1"

disable="@@thumbnail_f_disable_1" />
      <image name=“th2_f” image="@@browse_2_thumbnail" default_image="@@default_thumbnail_2" x=“443” active="@@act-browselist-2"

disable="@@thumbnail_f_disable_2" />
      <image name=“th3_f” image="@@browse_3_thumbnail" default_image="@@default_thumbnail_3" x=“808” active="@@act-browselist-3"

disable="@@thumbnail_f_disable_3" />
      <image name=“th4_f” image="@@browse_4_thumbnail" default_image="@@default_thumbnail_4" x=“808” active="@@act-browselist-4"

disable="@@thumbnail_f_disable_4" />


Thanks for the possible suggestion, but I don’t think this will work as far as i am aware (not tried it yet), but i forgot to mention I intend to use Joey Smyths moviesheet template  [Aeonish Hub Movie TGTMP] as below, i.e movie thumb (cover box) on the right and screenshot (backdrop) image on the left, hence my original align code - align=“left”

Bill Hicks - One Night Stand [1991].jpg

Any further thoughts?

Not a problem, the code was just to get you started, you will have to make corrections to it to make it work for what you are using.

All you need to do is change the alignment to “left”  and scale_type to “pan”.  You may also have to change the width & height to fit you needs. 

Hi TW, thanks alot for reply!! Much appreciated.

I understand what you are saying on your last suggestion and I already had scaletype fixed to "pan" and aligned left, as the code below.

<?xml version="1.0"?>
<page background="./image/RV-BG.jpg">
<image image="@@preview_rect_image" x="0" y="0" w="1280" h="720" scale="100" scale_type="pan" align="left" textcolor="@@preview_rect_color" keycolor="1" ignore_keycolor="1" bg="1"/>
<include filename="./rv_multi_edit_ctrls.xml"/>
<include filename="./rv_browse_common_ctrls.xml"/>
<listbox valkey="browselist" move="row" cols="4" rows="1" lbmask="ud" loop_scroll="1" _trigger="10" turbo_multi="10" autoenter="1" fixed_scrolling_col="1" hormove="1" />

<image image="image/user_icon_002.png" x="0" y="0" w="1280" h="720" />
<image image="@@poster" x="347" y="485" w="130" h="200" scale="100" scale_type="pan" align="right"/>

<wrapper y="200" w="360" h="220" scale="100" scale_type="pan" align="left">
<image name="th0" image="@@browse_0_thumbnail" default_image="@@default_thumbnail_0" x="0" scale="100" active="@@act-browselist-0" disable="@@thumbnail_disable_0"/>
<image name="th1" image="@@browse_1_thumbnail" default_image="@@default_thumbnail_1" x="380" scale="100" active="@@act-browselist-1" disable="@@thumbnail_disable_1"/>
<image name="th2" image="@@browse_2_thumbnail" default_image="@@default_thumbnail_2" x="760" scale="100" active="@@act-browselist-2" disable="@@thumbnail_disable_2"/>
<image name="th3" image="@@browse_3_thumbnail" default_image="@@default_thumbnail_3" x="1140" scale="100"active="@@act-browselist-3" disable="@@thumbnail_disable_3"/>


<wrapper y="170" w="460" h="280" scale="100" scale_type="pan" align="left">
<image name="th0_f" image="@@browse_0_thumbnail" default_image="@@default_thumbnail_0" x="0" y="200" w="360" h="220" scale="100" active="@@act-browselist-0" disable="@@thumbnail_f_disable_0"/>
<image name="th1_f" image="@@browse_1_thumbnail" default_image="@@default_thumbnail_1" x="350" scale="100" active="@@act-browselist-1" disable="@@thumbnail_f_disable_1"/>
<image name="th2_f" image="@@browse_2_thumbnail" default_image="@@default_thumbnail_2" x="740" scale="100"active="@@act-browselist-2" disable="@@thumbnail_f_disable_2"/>
<image name="th3_f" image="@@browse_3_thumbnail" default_image="@@default_thumbnail_3" x="1110" scale="100" active="@@act-browselist-3" disable="@@thumbnail_f_disable_3"/>
<image image="@@metadata_right_arrow" x="945" y="435" w="20" h="20" align="hcenter" scale="100" />
<image image="@@metadata_left_arrow" x="890" y="435" w="20" h="20" align="hcenter" scale="100" />

<text x="500" y="485" w="800" h="26" text="@@browse_text" fontsize="26" textcolor="0x6699ff" align="left" speed="1" delay="4" />
<text x="800" y="432" w="380" h="20" text="@@year" fontsize="16" textcolor="0xbbbbbb" align="right"/>
<text x="500" y="520" w="750" h="160" text="@@overview" fontsize="18" numlines="7" linespacing="1" textcolor="0xa4c8f0" align="left" disable_tail_dots="1" />

<text x="350" y="455" w="300" h="26" text="@@genre" fontsize="16" textcolor="0xbbbbbb" align="left" disable_tail_dots="1" />
<text x="175" y="455" w="640" h="26" text="@@totaltime" fontsize="16" textcolor="0xa4c8f0" align="right" />

<text text="@@pagecounter" x="825" y="432" w="204" h="26" fontsize="12" align="left" textcolor="0x07b5ff"/>

<wrapper y="448" w="134" h="187" align="hcenter" scale_type="fixratio" scale="100">
<image image="@@frame_0" x="137"/>
<image image="@@frame_1" x="283"/>
<image image="@@frame_2" x="429"/>
<image image="@@frame_3" x="575"/>

<include filename="./rv_multi_edit_widgets_for_gallery.xml"/>


The above code works fine but if i give the first thumb [highlighted in green] a negative x value say -250, so that the first thumb is partly 'off' screen to the left [like the first screen shot] it crashes.

Note- if it did work i would obviously then change all the other respective x values of the other thumbs to suit accordingly- i.e shift everything to the left.

Not sure if there is any other way or work around???

hope to hear from you soon!

Oh one last thing- how do you highlight xml code in say Notepad ++ in green so that the code is there but not active?

AND finally!! I noticed that you do this in you theme codes rather than deleting the code altogether. You also make notes like <folder thumb> , <focused thumb> etc as heading reminders- Please advise how this can be done. its probably such an easy thing to do but just haven't been able to work it out.

Ok, give me a little bit to look at the code and I’ll see what I can do.

One thing though is that you really should do is to change it so that you can have 5 thumbs displayed not 4 and then use the middle postion as your fixed postion.  The reason for this is because although using "fixed_scolling_coll=“1” works when you scroll forward, it doesn’t work scrolling backwards.

Also to anwer your other questions, to comment out some of the data all you have to do is to add “!–” at the begining and " --" at the end.  So you will have some like:

  (make sure that there's a space between "wrapper" and "--")

and to make the header for the data you just do:

<!–What ever you need here–>

But I will get back to on the code as soon as I can get something worked up.

@ architectonic

Here’s a basic mod of my Gallery View using the Aeonish Moviesheets to get you started.

This uses 4 Thumbs and contrary to other  peoples advice, fixed_scrolling_col=“1” works fine when scrolling Left or Right.


alternate picture link: http://www.mediafire.com/imageview.php?quickkey=h1dhz168vgqz6i3&thumb=4

1 Like

Sorry, Joey’s correct, for some reason I was thinking postion “0” that it doesn’t work.  Got my postions confused.:wink:

Hi Joey

This looks exactly what i was trying to achieve, Excellent work.

Will try this out later as i’m in work at mo.

Much appreciated.

And thanks TW for your input!!