kebab-case Converter
Convert text to kebab-case online. Turn titles into clean URL slugs, CSS class names, and HTML attributes with hyphens.
A kebab-case converter lowercases your text and joins the words with hyphens, producing strings like user-first-name. It is the standard format for URL slugs, CSS class names, and HTML attributes.
Examples
| Input | Output |
|---|---|
| How to Bake Bread | how-to-bake-bread |
| primaryButtonColor | primary-button-color |
| my_file_name | my-file-name |
When to use the kebab-case converter
kebab-case — also called dash-case or spinal case — is what the web itself runs on:
- URL slugs. Google has stated for years that hyphens are treated as word separators while underscores are not, so
bake-breadis parsed as two words andbake_breadas one. Hyphens are the SEO-correct choice. - CSS. Class names, custom properties (
--primary-color), and every built-in property name. - HTML attributes. Including
data-*attributes, which are hyphenated by specification. - npm packages and CLI flags. Package names and
--long-optionflags.
The one place it cannot go is a programming identifier — most languages read the hyphen as a minus sign, so user-name parses as subtraction. Use snake_case or camelCase there.
Frequently asked questions
Should URL slugs use hyphens or underscores?
Hyphens. Google treats a hyphen as a word separator and an underscore as a word joiner, so a hyphenated slug lets each word rank independently.
Is kebab-case the same as dash-case or spinal case?
Yes, all three names describe the same format: lowercase words joined by hyphens.
Can I use kebab-case for JavaScript variables?
No. The hyphen is the subtraction operator, so user-name would be parsed as user minus name. Use camelCase for JavaScript identifiers.