Hello @kanepaamauloa
The Classes property allows us to save component properties to classes. The main point is to allow us to quickly create classes from component properties and you can save anything to them, not just CSS properties.
For instance, imagine you have a button component with two style properties: color and width with Classes enabled:
We can define where we want the property to be used inside the component in Edit mode just like we would with any other property:
t
If I exit Edit mode and try to create a class at instance level, I will have the option to save the properties to the class:
I can now add a new Button instance and select the class:
The cool thing about this is that it allows you to save anything to classes, not just CSS properties. For instance, I will wrap my button component inside a flexbox component and add an image element. Then I will add an image property called ‘‘bottom image’’ to the flexbox component with Classes enabled:
I will then define where in the flexbox I want the image property to be used, in this case, as a URL in the image element:
Now, if I exit Edit mode, I can pass an image url to the Flexbox component:
And now I can create a new class that contains the image:
If I add another instance of the flexbox component, it will not have an image by default. I will have to upload it:
Instead of having to upload the image again or manually pass the properties, I can simply select the class I created with the image:
This is a super simple example just to illustrate how it works - passing an image like that is probably not the best use case, but the feature is just a way to allow you to create complex classes by saving anything you want (not just styles/CSS!) to them and reusing them from anywhere.
Is it clear?