The community members are discussing the upcoming CSS variable feature in Webstudio. The original poster asks if the CSS variables will be available directly in the Style panel or only in the Advanced section, as is the case in Webflow. The comments indicate that the CSS variable implementation in Webstudio will be even better than in Webflow, with features like global and tree-based overrides, default argument support, and the ability to use var(--some-var, --some-fallback). The community members are excited about the potential of this feature for theming and creating a more consistent design system. Some community members suggest collaborating on defining a standard style guide for Webstudio, while others caution that it may be difficult to create a "perfect" style guide and that it's important to allow for other community-driven style guides as well.
Hey Webstudio Team! I know you are working on CSS variable. I'd like to know if you plan to add CSS variable directly on the panel Style (meaning if it will be possible to make reference on them on the panel Style) or it will only be available Advanced section?
(this feature is available on Webflow, see the picture attached).
We also want to define a standard style guide for Webstudio to have a more consistent ecosystem, let's collaborate on that as soon as we have global variables in preview
I would be interested to collaborate with you about this topic.
But I’m not really sure that Style Guide is a topic for Webstudio. It’s really hard to make the « perfect style guide ». As you can see you have many style guide for Webflow : Client First, Lumos, Saadle… each one has its own vision, advantages, disadvantages and at the end the community pick up the best Style guide. This strategy is interesting because agency, freelances are gonna make some marketing for the adoption.
I think it’s a good idea to have some recommendations but you have to open the door to other Style Guides from the community!
In Webflow it was always messy… Finsweet's Client First, Lumos, dadada
I love the idea of building one concise styleguide and design system around Webstudio. And Craft is a great start. How can we create something that is super useful for the Webstudio community and works as one central "language" of design and development?
Are there more ideas of implementation? Craft 1.3 and above?