Surface levels exported for Web

[CarlosEGuerraSilva]

Currently, surface levels are not exported for web (not present in tokens.css).

But they are already generated

Consider add tokens for surface levels in the tokens.css file, like:

  --md-sys-color-surface-light-1: #EBF3F2;
  --md-sys-color-surface-light-2: #E3EEEE;
  --md-sys-color-surface-light-3: #DCEAEA;
  --md-sys-color-surface-light-4: #D9E9E8;
  --md-sys-color-surface-light-5: #D4E6E6;

  --md-sys-color-surface-dark-1: #131E1E;
  --md-sys-color-surface-dark-2: #152425;
  --md-sys-color-surface-dark-3: #172A2B;
  --md-sys-color-surface-dark-4: #172C2D;
  --md-sys-color-surface-dark-5: #183031;

[patzly]

As we can read at https://m3.material.io/styles/color/overview (and also experience with Material Components Android) the approach for surface colors has changed to a more flexible one, so I would instead wish that the new attributes like colorSurfaceContainerHigh will be implemented into the theme builder and the export feature.

[margeeta]

Hi y'all, new surfaces will be in a future release! Surfaces for Jetpack Compose is currently in progress.

[iqingting]

@margeeta not update yet, is there a release date for new surfaces?

[EvilasioAnisio]

Hi, any updates on this?

[mobilekosmos]

Not only for web, for all others too, I was getting crazy not understanding why the generator was not generating all colors visible in the docs.

[margeeta]

Included in 2.0
Figma: https://www.figma.com/community/plugin/1034969338659738588/material-theme-builder
Web: https://material-foundation.github.io/material-theme-builder/