Hey Webflow peeps! I'm writing to let everyone know that soon we'll be releasing an update to how styling works in the Style Panel.
Currently you have to create a class in order to reveal the styles for that element. Although this workflow may make perfect sense to someone used to writing CSS by hand, this name-first and style-second workflow can be unfamiliar and unintuitive to those new to the web design. As we know, coming up with good class names is hard. It’s even harder when you’re not exactly sure of the structure or design of the thing you’re building. With the update you'll be able to add styles immediately and worry about naming later.
How it works
When you add an element to the canvas, all your styling options in the Style Panel will be available immediately. At this point you can decide whether to create a new class and then add styles like you currently do, or you can add a style and we'll generate a class for you based on the element type.
Showing these controls up-front will help in a lot of ways...
- Reduces the confusion many first-time users experience when attempting to style an element
- Gives all user a new workflow to build layouts and experiments faster and save class naming for later (our recent class renaming improvements make class renaming a lot faster and easier)
- Opens up new doors for the Designer to utilize on-canvas controls instead of having all styling happen in the right panels
If you’re comfortable with your existing workflow, you can carry on as usual by either creating or selecting an existing class. Automatic class generation simply opens up a third option that allows you to immediately style an element.
Default selected state
Class created automatically
Notification appears for the first time