Integrate Sections into your own system

Class cleanup deserves its own dedicated explanation, because it transforms Sections from “quick drops” into properly integrated components inside your project.

‍

Start by replacing or removing global classes

If your project already has a system:

• Replace [class].section[/class] or [class].container[/class] with your own global section or container
• Remove heading classes (H1, H2, H3) to inherit your global typography
• Remove text classes to inherit your body defaults
• Replace button classes with your global button style

Doing this will immediately merge the Section into your existing system.

‍

Keep the layout classes

These classes define the structure of the Section and should stay:

• wrappers, grids, flex containers
• content blocks
• image holders
• decorative elements
• layout utilities specific to that Section

These are what give each Section its unique layout.

‍

Optional: rename structural classes

If you want your naming system to remain pristine, rename unique layout classes:

• [class]evermind-hero1-grid[/class] → [class]hero-grid[/class]
• [class]hollow-content-wrap[/class] → [class]content-wrap[/class]
• [class]forerunner-card-holder[/class] → [class]card-holder[/class]

Renaming is not required — it’s purely for aesthetic or organizational preference.

‍

Final step: remove unused classes

After the redesign, use Webflow’s “Clean Up” tool to wipe out unused classes.

It takes seconds and keeps your project light.