Inverse colors

[nicedisguise]

As we build out more of Flex 2.0 we are finding more and more places where the use of true inverse colors in dark theme are required. For example in the screen attached we lose the icons in the circles when in dark theme because they used the icon-inverse token which is the same as the regular icon color. Another example is in the chat bubbles where there are many variants of the bubble (eg, Agent, customer, internal chat) that are difficult to map out without the inverse colors for text.

Would it be possible to look at the colors again and make them truly inverse at some point in the future?

[nkrantz]

Hi @nicedisguise, thanks for following up with this. Katie created a ticket to explore inverse token mapping in Dark Theme, and we're going to try to prioritize this after our current release. Here's the ticket so you can follow along: https://issues.corp.twilio.com/browse/DSYS-2894.

[kate-porter]

@nicedisguise just wanted to add some more context to this discussion after what we talked about in our 1:1 yesterday, for any future folks who come here and search for "dark mode". 🙂

On your end, you are going to explore using color-text-weakest instead of color-text-inverse for these instances to see if that might meet your need in both light and dark modes. If you could followup on this discussion after you've done so, that would be great.

On our end, we are going to dig deeper into the mind-boggling intersection of dark mode and inverse tokens, and work on creating some guidelines for how best to think about and apply those inverse tokens when building with dark mode in mind.