Replies: 2 comments
-
Hi, I didn't quite understand how you have set up you theme object, but I am referencing the documentation: /** Index of theme.colors[color].
* Primary shade is used in all components to determine which color from theme.colors[color] should be used.
* Can be either a number (0–9) or an object to specify different color shades for light and dark color schemes.
* Default value `{ light: 6, dark: 8 }`
*
* For example,
* { primaryShade: 6 } // shade 6 is used both for dark and light color schemes
* { primaryShade: { light: 6, dark: 7 } } // different shades for dark and light color schemes
* */
primaryShade: MantineColorShade | MantinePrimaryShade; Do you have multiple shades for a given color theme? Could you provide the setup code and an image of the component that looks weird? |
Beta Was this translation helpful? Give feedback.
-
Hi sorry for leaving this for so long. We have a current colorscheme on our main site that I generate colors from and use the Sorry for the noise generated here. |
Beta Was this translation helpful? Give feedback.
-
Hi
We have an existing web-app that uses different different color shades in our code. In our theme we setup
primaryShade
to switch shades between light and dark. The issue is now that in all places where we have specified the shades stays the same making them look rather weird (or barely visible) in dark mode.What is the recommended setup for a nice dark mode experience? How are shades intended to interact with dark mode?
If someone has a good example with the recommended setup I would love to take a look.
PS: I'm pretty new to frontend styling so if what I am asking makes no sense I do apologize.
Beta Was this translation helpful? Give feedback.
All reactions