WPF Rendered Color inconsistency with Opacity on Brush and Control Elements

Question

Considering the following xaml.

<Window x:Class="PlayTabControl.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="350" Width="525">
    <Window.Resources>
        <ResourceDictionary>
            <Color x:Key="HintColor" A="255" R="0" G="0" B="0"></Color>
            <SolidColorBrush x:Key="HintColorBrush" Color="{DynamicResource HintColor}" Opacity="0.26"/>
        </ResourceDictionary>
    </Window.Resources>
    <StackPanel Background="White">
        <TextBlock FontSize="28" FontWeight="ExtraBlack"
                    Text="Hello World, #42000000" 
                    Foreground="#42000000"
                    HorizontalAlignment="Center"/>
        <TextBlock FontSize="28" FontWeight="ExtraBlack"
                    Foreground="{StaticResource HintColorBrush}"
                    Text="Hello World, HintColorBrush @ 0.26" 
                    HorizontalAlignment="Center"/>
        <TextBlock FontSize="28" FontWeight="ExtraBlack"
                Text="Hello World, #68000000" 
                Foreground="#68000000"
                HorizontalAlignment="Center"/>
        <TextBlock FontSize="28" FontWeight="ExtraBlack"
                    Foreground="Black"
                    Opacity="0.26"
                    Text="Hello World, Black TB@0.26" 
                    HorizontalAlignment="Center"/>
        <TextBlock FontSize="28" FontWeight="ExtraBlack"
                    Foreground="#FFbdbdbd"
                    Text="Hello World, #FFbdbdbd" 
                    HorizontalAlignment="Center"/>        
    </StackPanel>
</Window>

It produces the following result:

enter image description here

The observation to take from this is that Line1 and Line2 are of different colour. Line 3 is visually correct but numerically incorrect in terms of its colour input. Here is what is done to each line of Textblock.

Hard code Foreground colour of #42000000. This is approximately 26% opacity. Result: Incorrect
Brush resource of opacity of 0.26 with the color set to Black effectively. Result: Incorrect
The corrected numeric to produce the same perceived output. Which is in theory 40.6% opacity.
Using the Textblock's Opacity 0.26. Result: Correct
Hard coded colour of #FFbdbdbd, no transparency involved. Result: Correct

My question is: What/Why is wpf rendering this differently? This makes it difficult to reliably do colour styling when transparency is concern from a designer's sample/screenshot.

Note that out of curiosity, I have done this on a Windows store app as well. And the result is what I would expect, all the colours are the same except Line3 which will now be darker as it is more opaque.

You'll want to research the difference between RGBa and Opacity — Chris W., Jan 27 '15 at 20:27
@ChrisW. What's your point? If you would apply the different brushes and opacities to something else than text (e.g. the Stroke of a Line) you wouldn't notice these differences. — Clemens, Jan 27 '15 at 20:58
@Clemens yea sorry about that, obviously if there was a specific point than I'd have provided a specific answer. While although I think I have a good idea towards the culprit I'll have to swing back around when I have more free time than to just leave a vague directional response. Cheers — Chris W., Jan 27 '15 at 21:23
This [similar question](http://stackoverflow.com/q/6605534/1136211) was asked a while ago, although without a satisfying answer. — Clemens, Jan 27 '15 at 21:43

score 1 · Answer 1 · answered Nov 25 '20 at 14:27

If anyone has stumbled into this issue as well, it seems that setting TextOptions.TextFormattingMode to Display seems to fix the issue (you can set this at Window level so it affects all content). This does change the text rendering layout a bit though, so take that into consideration. See this for a bit more info on what's the difference.

WPF Rendered Color inconsistency with Opacity on Brush and Control Elements

1 Answers1