Tutorials

Delete unused classes in Webflow

6
min.
14.01.2025

When working in Webflow, you may delete sections or components but their CSS classes still persist in your project. These unused classes inflate your style sheet and can have a negative impact on your site's load speed. In this tutorial, we'll show you how to remove them safely.

Where can I delete unused classes in Webflow?

Removing unused classes is only possible in Design mode possible. Neither in Build mode still in Editor mode Do you have access to the necessary functions. So make sure you're in design mode.

Once you're there, you'll find a small Drop icon. Clicking on it opens an overview of all classes in your project.

Clean up unused styles

  1. Click on the Drop icon in the left bar.
  2. In the overview, you will find a brush icon called “Cleanup.”
  3. When you click on it, Webflow shows you them all not used Styles on.
  4. With another click, you can safely delete them.

Delete individual unused classes

If you specifically want to remove a single class, you can also do that:

  1. Search for the desired class using the search field in the style overview.
  2. When it is no longer in use, a appears Recycle bin icon next to it.
  3. Click on the icon to permanently delete the class.

Note: If a class is still being used somewhere in your design, the trash icon is not displayed and the class cannot be deleted.

Author

Ein Portrait von Felix Brodbeck

Felix Brodbeck

Felix Brodbeck is the founder of Designbase GmbH, UI designer and Webflow developer. He regularly shares his content on LinkedIn, YouTube, and this blog.

Felix Brodbeck, Webflow-Entwickler, Designer und Gründer der Designbase GmbH

Felix Brodbeck

Founder @ Designbase

Your Chance

Your Certified Webflow Premium Partner

  • Unique and scalable UI design
  • Professional Webflow development
  • Reliable, long-term support

Be careful with classes used by JavaScript

Before you delete any unused classes, note that some styles may be from JavaScript code be used. For example, a “is-active” class be added dynamically to elements via JavaScript in order to style them. If these classes are not used directly in Webflow but are important for scripts, they could be mistakenly identified as “unused” and deleted.

To be on the safe side, before cleaning up your styles, you should a backup of your Webflow site create. This allows you to easily undo any mistakes later on.

conclusion

By regularly deleting unused classes, you keep your CSS lightweight and prevent unnecessary code ballast. Follow this guide to keep your Webflow projects clean and performing! 🚀