XML Color Profiler - BlueMystical/EDHM_UI GitHub Wiki

All About XML Matrices

License: GPL-3.0+ Latest Release Downloads Issues Discord

EDHM lets you define colors for ship and station panels using an XML Color Matrix. The dependence on the matrix is a limitation of the current implementation and takes some getting used to, but there are plenty of presets available if it's too daunting for you.

Due to the complexities of the matrix, and how many other things rely on it, figuring out your matrix is always a good starting point for designing a coherent theme. This page attempts to explain the "how" and "why" of the XML Color Matrix, and is derived from a guide put out by psychicEgg.

Behind the Scenes

Every pixel displayed on a monitor consists of a mix of three primary colors: red, green, and blue (RGB). This is different from how non-digital artists work where the primary colors are red, blue, and yellow. Each of these colors has a range from 0 to 1, where 0 is "off" and 1 is the highest brightness and intensity.

XML Color Matrix Demo

For more examples, check out the XML combination chart here.

Breaking Down Elite Orange

We all know the default Elite Dangerous HUD is an obnoxious orange - that's why we're all here, right? Since we're all familiar with it, let's break down its matrix.

The dominant color of the ED HUD is (obviously) orange. The RGB values for true orange are full-strength red and half-strength green, or RGB(1, 0.5, 0).

Orange

While the actual value varies depending on which element you look at, the official Elite orange is actually RGB(1, 0.4352, 0).

Elite Orange

As you can see, red is the dominant color channel, since it is the dominant color in orange. Now, let's take a look at the XML matrix.

XML Matrices

The XML matrix defines a relationship between multiplier values from an external source (such as the GraphicsConfiguration.xml file, or the EDHM XML-Profile.ini file), and the color channels in an image. That is, the numbers in the matrix represent multiplier values that will be applied to the channels in a specific image, providing an adjusted output ([Custom RGB values] * [Image RGB values] = [Output RGB values]).

For example, imagine a white square, which has a value of RGB(1, 1, 1), but we want to make it pink. We would define the matrix for our square as RGB(1, 0, 1) and apply the above formula: RGB(1, 0, 1) * RGB(1, 1, 1) = RGB(1, 0, 1).

This is the standard XML matrix found in GraphicsConfiguration.xml (elite-dangerous-64 folder).

Default Matrix

Each value represents the RGB multiplier for a specific color channel in the image (each row). Simply put, the default matrix multiplies the matching channels in a given image by 1 (and, therefore, there is no change to the image). It sounds complicated, but it makes more sense once you see it in action.

If you recall, the dominant color channel in the default orange is red (RGB(1, 0.5, 0)), so let's define our red output by changing the values along the top line of the XML matrix. For example, if we wanted the dominant color to be purple, we could set the red channel multiplier to RGB(0.5, 0, 1).

Red - Purple Matrix

For a dominant green, we could set the red channel multiplier to RGB(0, 1, 0).

Red - Green Matrix

In other words, when starting to design your XML matrix, choose the dominant color first, and define its multiplier along the top line of the matrix (the red channel).

Practical Example

For our example, let's choose a night light blue RGB(0, 0.5, 1), or 0% red, 50% green, and 100% blue.

Red - Light Blue Matrix

Now we need to choose our secondary color. Remember, the green channel is the secondary color channel on the Elite HUD. So, on orange elements, our green channel output will be weaker than our red channel output (because, on average, green is 50% weaker than red in an orange image). However, on green elements, this green channel custom color will become the dominant color (green elements will swap to the new color).

Let's configure our secondary channel with a nice pink RGB(1, 0, 1)

Green - Pink Matrix

Now, everything that was green before (or has a green channel stronger than the red channel) will become pink. Note, however, that since orange consists of both red and green, your green channel will also contribute to your dominant HUD color, but to a lesser extent than your red channel. In our example, it will add a little pink to our light blue.

Take a look at the images below to see how these changes impact HUD elements.

  • Elite Orange (100% red channel, 50% green channel, 0% blue channel)

Orange Panel

  • 100% light blue (on the red channel)

Light Blue Panel

  • 100% light blue (on the red channel), 50% pink (on the green channel) Note: This image has been photoshopped slightly to accentuate the effect

Pink Panel

This is what makes XML matrices so complicated - output mix together in the same proportions as the original channels, so our orange elements now have 100% light blue RGB(0, 0.5, 1), plus 50% pink RGB(1, 0, 1).

As you have probably guessed, the third line in the matrix is the blue channel. In the Elite HUD, the blue channel is mostly zero for orange elements. Therefore, the blue channel won't have much (if any) impact on orange elements (anything multiplied by zero equals zero). However, the blue channel will have an effect on other elements that are white (an equal mix of all channels), and will be the dominant color on blue or cyan elements, such as the shield and certain icons. For our example, we're going to make these elements yellow RGB(1, 1, 0).

Blue - Yellow Matrix

Notice that while orange elements aren't influenced at all by this change, some elements have become yellow (such as the shield and optimal speed indicator), because the blue channel is dominant in these elements. You can also use negative numbers if you want to strengthen a particular color. For example, if we wanted our yellow to be stronger in the blue channel, we can reduce the blue output by 50% (-50).

Blue - Dark Yellow Matrix

Elite Dangerous Powers

The following table was derived from research done by psychicEgg and references raw decimal values found in the graphics shader.

Last update: Odyssey Feb 02, 2022 v10.1

Powers Color Table

Closing Thoughts

Designing a good XML matrix that makes you happy usually requires time and experimentation, but hopefully, the above information will steer you (at least slightly) in the right direction.

If you're struggling to find a combination you like that works well, you can also visit NO2O for inspiration and known-good combinations.