Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Theming] Project Chroma - color palettes in Radiance #400

Open
kirill-grouchnikov opened this issue Aug 19, 2022 · 8 comments
Open

[Theming] Project Chroma - color palettes in Radiance #400

kirill-grouchnikov opened this issue Aug 19, 2022 · 8 comments
Assignees
Labels
8.0 - Marble Release 8.0 - 2024.H2 Breaking change Marking changes that break backwards compatibility

Comments

@kirill-grouchnikov
Copy link
Owner

This will track work to modernize the way Radiance defines color schemes, as well as some of the relevant painters.

More details will be added when 7.0 development starts, but in the meanwhile, some code pointers

  1. SchemeBaseColors that defines the RGB colors that make up the "core" of the color scheme
  2. SchemeDerivedColors that defines colors that are derived from the base colors and have specific usage. Material Design spec calls these system tokens, but I prefer to call them semantic colors
  3. DerivedColorsResolverLight and DerivedColorsResolverDark that provide the default mapping of semantic colors to the underlying core scheme colors

Then, painters such as StandardFillPainter sometimes use the derived / semantic colors, and sometimes do an additional layer of "mixing" (like here) to get the colors they need for the visuals.

Recent additions in Radiance, such as fraction-based painters and direct values for derived / semantic colors made it easier for skins to have more precise control over the "flow" of RGB colors upwards into that skin's painters, the overall underlying system is showing the signs of its age.

The rough plan is to:

  • Define a color scheme in terms of tonal stops (which is what most popular design systems today do), with "values" in the range between 0 and 100.
  • Define semantic colors that map to the specific tonal stops in light and dark mode.
  • Refactor existing painters to exclusively use semantic colors by default, with escape hatches to use direct mapping to the tonal stops.
  • Refactor how light / dark color schemes are handled in Radiance. The idea is that a color scheme itself is not light or dark, but rather the skin is. And that defines what semantic color mappings that skin uses to the underlying tonal stops.
@kirill-grouchnikov kirill-grouchnikov added Breaking change Marking changes that break backwards compatibility 7.0 - Karat Release 7.0 - 2024.H1 labels Aug 19, 2022
@kirill-grouchnikov kirill-grouchnikov self-assigned this Aug 19, 2022
@kirill-grouchnikov kirill-grouchnikov added 8.0 - Marble Release 8.0 - 2024.H2 and removed 7.0 - Karat Release 7.0 - 2024.H1 labels Jun 6, 2023
kirill-grouchnikov added a commit to kirill-grouchnikov/ephemeral that referenced this issue Nov 18, 2024
Subset of MCU under Apache license, under Ephemeral package and with some cleanups to remove AndroidX / other annotations. Packaging, location and other things are not finalized.

For kirill-grouchnikov/radiance#400
@kirill-grouchnikov
Copy link
Owner Author

Update: this is happening soon, and until this issue is closed, the main Radiance trunk will be unstable, undergoing major internal and API changes.

kirill-grouchnikov added a commit that referenced this issue Nov 21, 2024
kirill-grouchnikov added a commit that referenced this issue Nov 30, 2024
Start wiring the new color tokens on buttons for #400
kirill-grouchnikov added a commit that referenced this issue Nov 30, 2024
kirill-grouchnikov added a commit that referenced this issue Dec 1, 2024
kirill-grouchnikov added a commit that referenced this issue Dec 1, 2024
Use onContainer tokens for title pane text, test logo and default (flat) visuals of control button icons. For #400
kirill-grouchnikov added a commit that referenced this issue Dec 1, 2024
Background, border, text. For #400
kirill-grouchnikov added a commit that referenced this issue Dec 1, 2024
kirill-grouchnikov added a commit that referenced this issue Dec 1, 2024
kirill-grouchnikov added a commit that referenced this issue Dec 2, 2024
Add surface render color tokens, use them for background tokens at the skin levels, use surface for the background fill. For #400
kirill-grouchnikov added a commit that referenced this issue Dec 3, 2024
* Default visuals for armed states
* Tonal based color for focus indicator

For #400
kirill-grouchnikov added a commit that referenced this issue Dec 3, 2024
And wire support for modified animation on tonal buttons for #400
kirill-grouchnikov added a commit that referenced this issue Dec 5, 2024
Allows specifying separate color schemes for tabs, marks (checkbox / radio button) and highlights. For #400
kirill-grouchnikov added a commit that referenced this issue Dec 6, 2024
kirill-grouchnikov added a commit that referenced this issue Dec 12, 2024
* Add Business Blue Steel
* Polish the colors of Business

For #400
@kirill-grouchnikov
Copy link
Owner Author

Current (pre-Chroma) visuals of the Business Blue Steel skin:

business-blue-steel-current

New (Chroma) visuals of the Business Blue Steel skin:

business-blue-steel-tonal

kirill-grouchnikov added a commit that referenced this issue Dec 12, 2024
kirill-grouchnikov added a commit that referenced this issue Dec 13, 2024
Use neutral container roles. For #400
kirill-grouchnikov added a commit that referenced this issue Dec 13, 2024
* Add Business Black Steel
* Add isDark() to the ContainerRenderColorTokens
* Update various painters to use different tokens for the dark visuals

For #400
@kirill-grouchnikov
Copy link
Owner Author

Current (pre-Chroma) visuals of the Business Black Steel skin:

business-black-steel-current

New (Chroma) visuals of the Business Black Steel skin:

business-black-steel-tonal

kirill-grouchnikov added a commit that referenced this issue Dec 16, 2024
kirill-grouchnikov added a commit that referenced this issue Dec 17, 2024
kirill-grouchnikov added a commit that referenced this issue Dec 17, 2024
kirill-grouchnikov added a commit that referenced this issue Dec 18, 2024
@kirill-grouchnikov
Copy link
Owner Author

tonal-palettes

kirill-grouchnikov added a commit that referenced this issue Jan 4, 2025
container -> container surface

For #400
kirill-grouchnikov added a commit that referenced this issue Jan 4, 2025
kirill-grouchnikov added a commit that referenced this issue Jan 5, 2025
* Move `ContainerColorTokensSingleColorQuery` to `colorscheme` package
* Add `DelegateFractionBasedTonalBorderPainter`
* Remove highlight APIs from `RadianceColorSchemeBundle2`
* Add `ContainerColorTokensSingleColorQuery.composite`
* Add `ContainerColorTokensTransform`
* Add `RadianceColorScheme2.getActiveContainerTokens`

For #400
kirill-grouchnikov added a commit that referenced this issue Jan 5, 2025
kirill-grouchnikov added a commit that referenced this issue Jan 6, 2025
…tainer tokens

Add APIs to generate container color tokens from a single seed

For #400
kirill-grouchnikov added a commit that referenced this issue Jan 6, 2025
…tainer tokens

Convert existing tonal skins to use container token APIs, and remove the old ones

For #400
kirill-grouchnikov added a commit that referenced this issue Jan 6, 2025
kirill-grouchnikov added a commit that referenced this issue Jan 6, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
8.0 - Marble Release 8.0 - 2024.H2 Breaking change Marking changes that break backwards compatibility
Projects
None yet
Development

No branches or pull requests

1 participant