Join the Webstudio community

Updated 3 months ago

Remove default classes & body presets

At a glance

The community member is new to Webflow and wants to remove the default classes like w-text and w-paragraph, as well as the body presets. Other community members explain that these classes and presets are generated from Webflow's tokens and presets, which are used to normalize styles across browsers. They suggest that the community member can change the styles from the style panel instead of removing the classes. The community members also discuss how Webflow's abstraction with tokens and presets can improve loading performance, though the community member can opt out of this in the project settings if desired.

Hi everyone, I am just starting with webflow. I cannot find how to remove default classes on components such as "w-text" or "w-paragraph" and also how to remove body presets? thanks
B
j
9 comments
Those classes are generated from presets and tokens. You can change any style from style panel. Why do you want to remove those?
I´d like to have clean and neutral elements before styling with classes. This is why I am interested in webstudio and trying to ditch usual web builder which are very opinionated with sooo many default styling
Why do you need visual builder then?
because of conveniance of live preview and dynamic link with CMS. I know HTML, CSS but I am lacking API knowledge and i am just average in JS for now
I mean webstudio abstracts classes with presets and tokens. Presets are basically normalizers between browsers.
So you dont need to remove them
If you familiar with sass, tokens is the same as mixins there.
Thank you for the explanation, tokens make more sense to me now 🙂
This abstraction allows us optimize resulting css with atomic styles where each property has separate class reused between html elements. This drastically improves loading performance. Though you can opt out of it in project settings.
Add a reply
Sign up and join the conversation on Discord