Kebab Case Converter: Text to kebab-case Online

What kebab-case is

kebab-case uses hyphens where the spaces would be and keeps every letter lowercase:

My Blog Post Title becomes my-blog-post-title
backgroundColor becomes background-color
user_profile_card becomes user-profile-card

How the converter works

The tool finds the words on each line, lowercases them and joins them with hyphens. Words can be separated by spaces, underscores, dots or slashes, or by capital letters as in camelCase and PascalCase. Punctuation is removed. Each line is converted separately, so you can paste a list of titles or class names and get a matching list back.

Input	Output
My First Blog Post!	my-first-blog-post
backgroundColor	background-color
user_profile_card	user-profile-card
ProductListItem	product-list-item
10 Tips for Better Sleep	10-tips-for-better-sleep

Where kebab-case is used

URLs: example.com/blog/my-first-post
CSS: class names such as .nav-item and properties such as font-size
HTML: attributes such as data-user-id and custom element names such as <user-card>
File and folder names: especially in web projects
npm packages: package names must be lowercase, and hyphens are the usual separator
Command line flags: --dry-run, --no-cache

kebab-case for URL slugs

A slug is the readable part of a web address that identifies a page. Good slugs are short, lowercase and hyphenated. Paste your page title here to get a starting point, then trim it:

Convert the title: “10 Tips for Better Sleep” becomes 10-tips-for-better-sleep.
Remove filler words if the slug is long: tips-better-sleep.
Keep the main keyword of the page in the slug.

Lowercase matters because many web servers treat /My-Page and /my-page as two different addresses.

Compared with other styles

Style	Example	Works in code?
kebab-case	user-first-name	No, hyphen means minus
snake_case	user_first_name	Yes
camelCase	userFirstName	Yes

Need one of the others? Try the snake case converter or the camel case converter.

Kebab Case Converter: questions and answers

What is kebab case?

Kebab case writes a multi-word name in lowercase with hyphens between the words, as in main-nav or my-first-post. The words look like pieces of food on a skewer. It is also called dash case, hyphen case, lisp case or spinal case.

Why are hyphens better than underscores in URLs?

Google recommends hyphens to separate words in URLs because they are treated as word breaks, which helps search engines and people read the address. Underscores can be read as joining two words into one.

Can I use this as a URL slug generator?

Yes. Paste a page title and the converter lowercases it, removes punctuation and joins the words with hyphens. 'My First Blog Post!' becomes my-first-blog-post. Accented letters are kept as they are, so replace those by hand if your site needs plain ASCII slugs.

Can I use kebab-case for variable names?

Not in most languages. JavaScript, Python, Java and many others read the hyphen as a minus sign, so user-name would mean 'user minus name'. Use camelCase or snake_case in code, and keep kebab-case for URLs, CSS, HTML attributes and file names.

Kebab Case Converter

Convert to

For code