With this new feature, you can add, edit, and delete up to 8 font variables (including the default app font) and 32 color variables (including the 8 default color variables).
You can access your new font variables in a section at the top of the font dropdown in the property editor, and new color variables in the palette section of the color picker. You can hover over colors in the palette to see the variable name and corresponding hex code.
If you delete a variable, the variable’s value will stay in use where it’s already referenced and add a (DELETED) tag to its name. You won’t be able to use a deleted variable in new places. To access the hex code of a deleted variable that is still referenced in your app, you can click the swatch adjacent its name in the color picker to copy its hex code.
And yet with all of this innovation and feature dropping, there is still no direct and native functionality for enabling a dynamic dark/light mode functionality with this, so custom option sets and plugins like Dark Theme Detector in order to give users modern web experiences that are not only wanted, but fully expected now.
Awesome @manasi, have been looking forward to this for a while!
Could one imagine that it would be possible to change user-generated color variables dynamically, e.g. when the user flips a dark/light mode switch? In such case, it would simply be a matter of applying those dynamic color variables to elements you would want to be affected by a dark/light theme switch, instead of having to use conditionals on every single element.
As @vadim.vozmitsel mentioned, dark/light mode has become an expected feature, especially for productivity apps.
How do you see dark/light mode least painfully implemented currently? Using conditionals on Element styles will get you some of the way, but it’s still a lot of conditionals, and some elements might not have a style applied for one reason or another.
Everyone, myself included, agrees that there are plenty of areas that the team at Bubble can improve upon but this has been a much requested feature too.
I don’t mean to single you out but posts like yours take away the joy of having new features being added.
It’s hard to please everyone but I believe that the team at Bubble have been very good to the community. I’ve been Bubbling for a while and to me there’s a good pace of improvements and added features.
The team at Bubble know there are a lot of core features that they need to add/improve and my confidence that 2023 will be an exciting year for us all was justified with the announcement that Emmanuel will go back to spearheading the engineering team.
Thank you! This will make a huge difference.
