Component classes combine two or more basic elements into units with greater visual and interactive meaning than their constituent parts.

Elements with component classes make up components. Components are made up of a main element and multiple secondary elements.

Example: a blog card or a subscription form.

Naming convention

| Main component class:

Full name of the molecule Card
Secondary component class:
Molecule name plus child element identifier Card - Image

Component classes included in The System

Since components are unique to each project, The System template does not include component classes. It does include an example Card component to illustrate how these classes are used in The System.

There is only one component class created in The System and it corresponds to the only component that comes by default in Webflow, the Rich Text. The class gets the same name Rich Text.

Prev

<aside> ⬅️ Basic classes

</aside>

Next

<aside> ➡️ Structural classes

</aside>


Index