You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
@wordpress/theme currently provides utilities for a single color ramp from a given seed value.
An existing use-case already exists in real-time collaboration, where collaborators are assigned a color used as a border in their avatar presence. These colors are currently hardcoded, and do not change or align to a given theme context. The pull request #74875 explored trying to integrate this behavior with theming, though the specific technical direction had some trade-offs.
What is your proposed solution?
The @wordpress/theme package should provide utilities for generating a set of complementary colors that follows from the theme and/or a specified seed value.
My recommendation would be a pair of:
Utility function that accepts a seed value provided by the consumer and generates a set of complementary colors
A higher-level React hook which uses the underlying utility function, but which prepopulates the seed value using the current theme context primary color
This should ideally use existing tools within @wordpress/theme and its color dependencies (colorjs.io).
Considerations:
Return type: Current known use-cases in real-time collaboration only have need for a set of color values that are used for avatar borders. Depending on how this is generalized as part of UI: Add Avatar component #76836, there might be situations where we'd want to know a good color for text that would be shown on top of each color (e.g. pairs of background/foreground colors, see Chakra UI example).
What problem does this address?
@wordpress/themecurrently provides utilities for a single color ramp from a given seed value.An existing use-case already exists in real-time collaboration, where collaborators are assigned a color used as a border in their avatar presence. These colors are currently hardcoded, and do not change or align to a given theme context. The pull request #74875 explored trying to integrate this behavior with theming, though the specific technical direction had some trade-offs.
What is your proposed solution?
The
@wordpress/themepackage should provide utilities for generating a set of complementary colors that follows from the theme and/or a specified seed value.My recommendation would be a pair of:
Example API signatures:
This should ideally use existing tools within
@wordpress/themeand its color dependencies (colorjs.io).Considerations: