Colors do not match UI Builder / USS variables

Unity Engine
,
1

I am currently prototyping some screens with with UI Toolkit and noticed that the colors are totally different in the game and scene view when compared to the UI Builder. When compared to the raw hex values, the colors in the builder are correct and the scene and game views are the incorrect ones.

Example 1:
The background and icon colors are lighter and a kind of washed out.

8925179--1222973--Screenshot 2023-04-04 004116.png
8925179--1222973--Screenshot 2023-04-04 004116.png1166×624 62.7 KB

Example 2 (top is gameview, bottom is the UI builder):
Notice how the background image and the gradient overlay (just a simple texture) are being blended quite differently. The game view has a lot more contrast, where the UI builder has the proper ‘overlay only’ blending.

8925179--1222976--Screenshot 2023-04-04 004554.jpg
8925179--1222976--Screenshot 2023-04-04 004554.jpg1296×894 229 KB

My scene only has the UIDocument component on a single game object, not even a camera.

The project uses URP with HDR enabled, but changing those settings didn’t change anything.
The current editor version used is 2023.2.0a8.

Is there a setting I am missing somewhere? Thanks in advance!

2

Hey, it might be related to this issue UI Builder doesn't support linear color space (and UI toolkit too?)

2 Likes
3

Thanks for the link. I don’t think I quite understand the reason for trying to switch to linear space in the UI Builder.

The UI Builder shows the same colors as Figma or Photoshop, whereas the game view (using linear space) looks wrong. Would switching to a linear-based working for the UI mean that I would have to use different colors or pre-process the images so they match the reference files?

I would love to simply use the same hex-values from my graphics apps in the USS files and let the engine work out the rest.

Cheers!

Edit: Apparently this has already been asked/requested in this thread: UIElements Runtime with different color spaces