Create adr-002-fgColor-onEmphasis.md

[lukasoppermann]

See ADR

[changeset-bot]

⚠️ No Changeset found

Latest commit: 42adec3

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

[langermank]

I'd like to add some images and context to help us further discuss this decision.

Currently, in dark high contrast theme we invert fgColor-onEmphasis from white to black. This is the only theme we do this in. The decision to do this doesn't appear to be recorded, so we don't know for sure the reasoning. We're assuming this was done so that background colors could be more saturated and appear higher contrast against the default/muted backgrounds.

The inverted color is a bit challenging from a maintenance perspective, and increases the overall complexity of our color system. However, if it provides a better or more comfortable reading experience I'm personally fine with keeping it.

Below is a snippet of the existing experience. I know its difficult to evaluate out of context but just to give us a rough idea. On the left is default dark theme with both bgColor-default and bgColor-muted.

This is a proposed path forward where we use white text, but maybe introduce more bright border colors to add more contrast.

In the existing experience, the contrast ratios are as follows for the primary button:

colors	ratio
bgColor-muted vs primary button bg	6.3
primary button bg vs primary button text	7.15
primary button border vs bgColor-muted	10.23

In the proposed solution, the contrast ratios are as follows:

colors	ratio
bgColor-muted vs primary button bg	2.3
primary button bg vs primary button text	7.6
primary button border vs bgColor-muted	10.23

Without the border color, the background definitely loses some contrast against bgColor-muted. However, with white text it seems like we may actually increase the contrast.

Would love to hear some thoughts and opinions!

[langermank]

I made some edits, but I feel confident moving forward with this decision since we've been internally testing it with no complaints.