Part of #53322

What problem does this address?

The current Gutenberg colour system has been great for the editor, however we are starting to see the limitations while designing for a dark surface (e.g. site editor). If we want to lean heavily into personalization, support themes including dark, and offer a contrast preference (empowering users to achieve AAA conformance), then we will need to extend the system and take a more programmatic approach.

One of the biggest gaps in our current system is a limited bottom end of the scale. e.g. for component backgrounds, states etc

What is your proposed solution?

We can learn a lot from other systems out there, one of which is Radix colors. One additional piece of complexity is that we'd ideally want to programmatically generate themes based on single colour values. The benefit of a scale like Radix is that "each step was designed for at least one specific use case." This means that you have contrast guidelines built in ("Step 11 is designed for 400 weight text in any size, and guaranteed to work well on a step 3 background. Each test should pass 4.5:1 contrast ratio.")

The good news is that we already have an experimental theme provider in our components package and tools to generate scales based on a single value.

• Design a new colour scale
• Programatically generate these scales via theme provider
• Update primitives to make use of theme
• Update environments to use theme provider