Kebab case converter
Lowercase words joined with hyphens — the form the web runs on. Turn a headline into a URL slug, or a camelCase identifier into a CSS class name.
Kebab case is the web's case
URL paths, CSS class names, CSS custom properties, HTML attributes, npm package names and most static-site file names all use hyphens. Some of these are enforced: HTML attribute names and CSS custom properties (--brand-color) are lowercase-with-hyphens by specification, not by convention.
For URLs specifically, Google has said for well over a decade that hyphens are read as word separators and underscores are not — case-converter is two words to a search engine and case_converter is one. On a page whose whole purpose is to rank for a phrase, that is not a detail worth losing.
Making a slug that survives
A slug has to be safe in a URL, which means no spaces, no punctuation and no ampersands. This converter drops everything that is not a letter or a digit and joins the remainder with single hyphens, so Café Noir & Co. becomes café-noir-co — one hyphen, no trailing hyphen, no empty segment where the ampersand was.
Accented letters are kept rather than stripped. Modern browsers and servers handle them, and for non-English sites removing them mangles the words. If your stack needs pure ASCII slugs, transliterate before converting rather than deleting the characters, which turns Grüße into gre.
Two things a converter cannot decide for you: how long the slug should be, and whether it is unique. Search results truncate long URLs, and three or four words is usually enough; uniqueness is your database's job.
Worked examples
Run through the same code the button runs, so the examples cannot drift from the tool.
| Input | kebab-case |
|---|---|
How To Sort Lines Alphabetically | how-to-sort-lines-alphabetically |
userProfileCard | user-profile-card |
Café Noir & Co. | café-noir-co |
Common questions
What is kebab-case used for?
URL slugs, CSS class names and custom properties, HTML attributes, npm package names and file names. Anywhere outside code where a hyphen is safe and readable.
Are hyphens or underscores better in a URL?
Hyphens. Google treats a hyphen as a word separator and an underscore as a joiner, so hyphenated words in a slug are read as separate terms. Underscores can also be hidden by a link underline.
Does the converter remove accented characters?
No, it keeps them. Removing them mangles words in most languages. If you need pure ASCII slugs, transliterate the text first rather than deleting the characters.
Other text tools
- Case converterAll tools
- Sentence case converterCase
- Title case converterCase
- Uppercase converterCase
- Lowercase converterCase
- camelCase converterCode
- Snake case converterCode
- Remove line breaksLines
- Remove extra spacesLines
- Sort lines alphabeticallyLines
- Remove duplicate linesLines
- Reverse textLines
- Word counterCount