Skip to content
| Marketplace
Sign in
Visual Studio Code>Other>classifyNew to Visual Studio Code? Get it now.
classify

classify

Hrashikesh Pandey

|
8 installs
| (1) | Free
A vs code plugin to generate meaningful classnames for pages and component without any hustle bustle
Installation
Launch VS Code Quick Open (Ctrl+P), paste the following command, and press enter.
Copied to clipboard
More Info

Classify - Smart Class Name Generator for VS Code

Classify is a powerful and intuitive Visual Studio Code extension designed to help developers generate meaningful, context-aware class names for their CSS and HTML files. By leveraging AI-powered suggestions, customizable naming conventions, and other advanced features, Classify streamlines the process of creating clean and maintainable class names.

Features

  • Contextual Naming: Generate class names that are contextually relevant, taking into account the roles and positions of elements within the DOM.
  • Class Name Previews: Instantly see the generated class names with corresponding CSS snippets or SCSS partials for easy integration.
  • Custom Naming Conventions: Define your own prefixes, suffixes, and naming rules to tailor the generated class names to your specific project needs.

Installation

To install Classify:

  1. Open Visual Studio Code.
  2. Go to the Extensions view by clicking on the Extensions icon in the Sidebar or by pressing Ctrl+Shift+X.
  3. Search for "Classify - Smart Class Name Generator."
  4. Click Install.

Usage

Generate Class Names

  1. Open an HTML file in VS Code.
  2. Press Ctrl+Shift+P (Windows/Linux) or Cmd+Shift+P (Mac) to open the Command Palette.
  3. Type "Generate Class Names" and select the Classify: Generate Class Names command.
  4. The plugin will analyze the current page or selected elements and provide you with a list of meaningful class names.
  5. Choose your preferred class names and apply them directly to your HTML file.

Customize Naming Conventions

You can customize the naming conventions to fit your project's style:

  1. Open the extension settings by navigating to File > Preferences > Settings.
  2. Search for "Classify" to find the customizable options.
  3. Set your preferred prefixes, suffixes, and other naming rules.

View and Manage Suggestions

Classify provides a mini-dashboard to manage and preview your class names:

  1. Open the Command Palette and type "Classify Dashboard" to launch the mini-dashboard.
  2. Review, tweak, and apply the generated class names from the dashboard.

Contact

For any issues or questions, please feel free to open an issue in this repository or contact us at [hrashikeshpandey1@gmail.com].


Happy coding with Classify! 🎉 Made with ❤️ by Hrashikesh Pandey

  • Contact us
  • Jobs
  • Privacy
  • Manage cookies
  • Terms of use
  • Trademarks
© 2025 Microsoft