How to Delete Unused Classes in Webflow

Unused classes can quickly build up in a Webflow project, especially after removing sections, components, or older page designs. They make the Style Manager harder to navigate and can leave unnecessary CSS in your project.

In this tutorial, I'll lead you through finding and deleteing unused classes in Webflow plus how to remove individual classes, and what to check before cleaning up your styles.

If you prefer watching a video, I created this step-by-step guidance on YouTube where I show you how I clean up Webflow classes in practice - remove individual classes, clean up unused styles and organize the project more efficiently.

Where Do You Delete Unused Classes in Webflow?

You can delete unused classes from the Style Manager in Webflow's Designer.

The Style Manager is available in Design mode, not in the Editor. If you are currently working in another mode, switch to the Designer before starting the cleanup.

From the Style Manager, you can:

• Review the styles and classes in your project.
• Search for a specific class.
• Identify styles that are not currently used.
• Remove unused classes individually.
• Clean up unused styles in bulk.

Webflow's Style Manager also includes HTML tags alongside classes, so check what you are deleting before confirming a cleanup.

How to Delete Unused Classes in Bulk

If your project has accumulated many unused classes, the cleanup function is the fastest option.

1. Open your Webflow project in the Designer.
2. Make sure you are in Design mode.
3. Open the Style Manager from the left toolbar.
4. Click Clean up.
5. Review the unused styles Webflow has identified.
6. Click Remove to delete them.

Webflow only allows styles to be cleaned up when they are not currently applied to elements in the project. Used classes cannot be removed through the cleanup function.

Before confirming the removal, review the list carefully. If you are working in a large project or a shared design system, some classes may be intentionally kept for future use even if they are not currently applied to a page.

How to Delete Just One Unused Class

If you only want to remove a specific class, delete it individually from the Style Manager.

1. Open the Style Manager.
2. Search for the class you want to remove.
3. Check whether the class is still applied to an element.
4. Open the class options.
5. Click the trash icon or delete option.
6. Confirm the removal.

If Webflow doesn't show a delete option, the class is still being used somewhere in the project. Find and remove all remaining instances first, then return to the Style Manager.

Deleting a class removes its style definition from the project. It does not, however, remove an element that uses the class.

Be Careful With JavaScript Classes

Before deleting a class, check whether it's used outside the Webflow Designer.

A class may be added or removed dynamically by:

• JavaScript
• Custom code
• An interaction or animation
• A component state
• An external integration
• A third-party script or library

For example, a script may add an "is-active" class to a navigation menu, modal, tab, or accordion when someone interacts with it. Webflow may not identify that class as being used in the Designer, even though the class is important to the live website.

Before deleting a class, search your custom code and project scripts for the class name. If you aren't sure what a class does, keep it until you have tested the relevant interaction on the published site.

Create a Backup Before Cleaning Styles

I recommend creating a manual Webflow backup before removing unused classes, especially on a large or production website.

Create a backup if you are:

• Cleaning up a client project.
• Removing a large number of styles.
• Working with custom JavaScript.
• Using components or third-party libraries.
• Making changes to a live marketing website.

Give the backup a clear name, for example "Before style cleanup." If an interaction or layout stops working after the cleanup, you can restore the earlier version instead of rebuilding the deleted styles manually.

Test the Site After Cleanup

After deleting unused classes, review the project before publishing it.

Check:

• Key pages and templates.
• Navigation and mobile menus.
• Forms and validation states.
• Modals, tabs, and accordions.
• Hover, focus, and active states.
• CMS collection templates.
• Components and component variants.
• Custom code and integrations.
• Responsive layouts at each breakpoint.

Then publish the site and test the most important interactions on the live domain. A project can look correct in the Designer while a JavaScript-driven interaction fails in the browser.

A Quick Webflow Cleanup Routine

You don't need to clean up your classes after every small design change. I usually recommend doing it after a larger project milestone:

Finishing a website redesign.
Removing an old page system.
Replacing a component library.
Cleaning up a template-heavy CMS project.
Removing experimental interactions.
Completing a migration or rebuild.

Before each cleanup, create a backup, review the classes Webflow has flagged, and test the live site afterward. This keeps the project organized without turning style cleanup into a risky one-click process.