Class Naming Systems

Here a compilation of different frameworks you can use in your Webflow project.

For each one I include:

  • Creator info
  • Documentation
  • Figma and YouTube video if available
  • Link to Cloneable
  • Other info

Not sure how to name them, there are people calling them in different ways such as:

  • Class Naming Systems
  • Naming Systems
  • Frameworks
  • Style Guides
  • Webflow Naming Systems
  • UI Systems

Name them as you wish.

Why did you choose these ones?

Many are the most used ones. Made some scrapping and included:

  • Most used Class Naming Systems
  • Others I think are really interesting if you are coming from design
  • Simple and clean ones so you can use them easily
  • Other

How to decide which Class Naming System to use?

You should take into account several variables:

  • Background: It is not the same if you can from Design, Code or Marketing, or maybe you are a NoCoder integrator.
  • Your Webflow knodwledge: Do not go for an advanced naming system if you are just beginning. Go step by step. Also I recommend for example to test one Class Naming System on simple site or a landing page.
  • Learning curve: Some of them are for advanced users, others you can learn in some hours
  • Community Support
  • What do you want to build: It is not the same to build a Landing page than an e-commerce shop or a site with many CMS collections
  • Price: Is it free or paid?
  • Some have also Components, maybe you are interested on them also

Take your time and test. Probably you will some good ideas in different systems so you will end up doing your own Class Naming System as many Webflow Developers do.

What can you find here?

Where can I submit my Class Naming System?

Submit your naming system