Back to Free Tools
FREE TOOLS
BEM Class Name Generator
Generate every block, modifier, element and element-modifier class in a bounded naming family.
Block name, Newline-separated element and modifier lists
bem-classes.txt, bem-class-report.json
Browser only
Runs locally in your browser. Your files, pasted content and generated output are not uploaded. Reset clears this tool’s working data.
This tool needs JavaScript. If it does not load, refresh the page and try again.
How to use this tool
- Enter the block and optional element/modifier lists, one part per logical record.
- Select Generate BEM classes and inspect the complete class count.
- Download bem-classes.txt and bem-class-report.json.
Examples
Block button, element icon and modifier primary generate button, button--primary, button__icon and button__icon--primary.
Limitations
- Parts use lowercase ASCII letters and digits with single separating hyphens, start with a letter and contain at most 64 units. Each list is at most 6600 units and 100 parts; blank records and duplicates refuse. Empty lists and one terminal framing delimiter are allowed.
- The complete product (1 + elements) × (1 + modifiers) must be at most 10000 classes. At most 2 MiB combined output and 30 seconds. Input order is preserved. No CSS/HTML preview, sanitization or ecosystem-wide naming conformance is claimed.
Related tools
No items found.