kebab-case converter

kebab-case is what URLs and CSS use, and in both cases for a reason that is not arbitrary. In a URL, Google has stated plainly that hyphens are treated as word separators and underscores are not — my_blog_post reads as one token to a search engine while my-blog-post reads as four words. That makes hyphens the correct choice for any slug that you want found, and it is why every content management system generates them.

CSS uses hyphens because the language predates the convention debate and because a hyphen cannot appear in a JavaScript identifier, which neatly separates the two worlds — background-color in CSS becomes backgroundColor in the DOM, and the mapping is mechanical. Custom properties follow the same rule: --brand-primary, never --brandPrimary.

One thing hyphens cannot do is appear in an identifier in most programming languages, because the parser reads them as subtraction. my-variable in JavaScript is my minus variable. That is exactly why kebab-case is safe for URLs, filenames and CSS and unusable for variable names — and why converting a config key from kebab to camel is such a common step in build tooling.