Describe the bug
According to the specs for the Navigation Rail (https://m3.material.io/components/navigation-rail/specs)
the Navigation rail container color is specified as md.sys.color.surface which maps to md.ref.palette.neutral98
Looking at the Figma project, the container in which the building blocks are presented, for both light and dark theme (Navigation Bar)
seems to be using md.sys.color.surface-container which maps to md.ref.palette.neutral94
The difference in color is not that big, but I am sure there is a logic to all of it, especially when toggling between light and dark themes.
It is not the only component which has this type of discrepancy.
Expected behavior
Good question... what is the expected behavior?
Should we be following those/what specs?
...which of them are out of sync?
Or... do we just throw whichever surface looks better in our components.
I've been trying to wrap my head around Material 3 and it is not easy... there's a lot more to it than just some colors, but they are the basis and this kind of confusion brings everything into question.
Funny thing is, I bet a lot of people use tokens from the Figma file to base their components on, and not too many look at the (I assume official) specs. Kinda' means everything that was built upon that is... at the very least inconsistent.
Describe the bug According to the specs for the Navigation Rail (https://m3.material.io/components/navigation-rail/specs) the
Navigation rail container coloris specified asmd.sys.color.surfacewhich maps tomd.ref.palette.neutral98Looking at the Figma project, the container in which the building blocks are presented, for both light and dark theme (Navigation Bar) seems to be using
md.sys.color.surface-containerwhich maps tomd.ref.palette.neutral94The difference in color is not that big, but I am sure there is a logic to all of it, especially when toggling between light and dark themes. It is not the only component which has this type of discrepancy.
Expected behavior Good question... what is the expected behavior? Should we be following those/what specs? ...which of them are out of sync?
Or... do we just throw whichever
surfacelooks better in our components.I've been trying to wrap my head around Material 3 and it is not easy... there's a lot more to it than just some colors, but they are the basis and this kind of confusion brings everything into question.
Funny thing is, I bet a lot of people use tokens from the Figma file to base their components on, and not too many look at the (I assume official) specs. Kinda' means everything that was built upon that is... at the very least inconsistent.