kebab-case Converter

Convert text to kebab-case instantly for URL slugs and CSS class names — free online.

Convert to

About

About the kebab-case Converter

Joins words with hyphens in lowercase — "user profile card" becomes "user-profile-card". It's the standard form for URL slugs, CSS class names, and npm package names, since hyphens read cleanly in a URL without needing to be escaped the way a space would.

Kebab-case is the usual shape for URL slugs, so it helps to know exactly what's kept: letters (including accented Latin letters like é), digits and the hyphens between words. Everything else — punctuation, emoji and symbols — is dropped, so "10 Tips & Tricks!" becomes "10-tips-tricks". Letters outside the Latin alphabet, such as Cyrillic or Chinese, are dropped as well.

Choose what to view about this tool

Guide

Using the kebab-case Converter

  1. 1

    Step 1

    Type or paste your text into the input box.

  2. 2

    Step 2

    Click kebab-case, or it converts live as you type since this page presets that case.

  3. 3

    Step 3

    Copy the result, or try one of the other case buttons below the input.

  • Builds lowercase, hyphen-separated text as you type — ready for a URL slug
  • Strips punctuation and symbols, so no stray ?, & or # ends up in a link
  • Collapses spaces, underscores and repeated separators into a single hyphen
  • Ten other cases are one click away on the same text
  • Copy the result in one click, or Clear to start over
  • Runs entirely in your browser — free, with no sign-up and no limit

Bloggers and SEO teams

Content teams turn post titles into clean URL slugs.

Front-end developers

Developers name CSS classes and BEM blocks.

Node.js developers

Developers name npm packages and files.

Web component authors

Authors name custom elements, which must contain a hyphen, like my-button.

Convert to another case

UPPERCASE Converter lowercase Converter Title Case Converter Sentence case Converter camelCase Converter PascalCase Converter snake_case Converter

Examples

kebab-case Converter examples

4 worked examples

01

Three-word phrase

Type "User Profile Card" to get user-profile-card, with the words joined by hyphens and everything lowercased.

02

Already has underscores

Type "user_profile_card" and it still converts to user-profile-card, since underscores count as a word boundary too.

03

Punctuation and numbers

Type "Order #42, Final Review!" to get order-42-final-review, since punctuation splits words just like spaces do.

04

A CSS class name

"Primary Button Large" converts to primary-button-large, ready to use as a CSS class.

Related tools

Text Reverser

Reverse characters, words, lines, or the letters inside each word.

Use it

Remove Duplicate Lines

Keep the first occurrence of each line and report how many were removed.

Use it

Remove Extra Spaces

Collapse repeated spaces, trim lines and tidy up line breaks.

Use it

Line Sorter

Sort lines alphabetically, numerically, by length, or shuffle them.

Use it

Find and Replace

Plain-text or regular-expression replacement with a count of matches.

Use it

Text Compare

Line-by-line difference between two versions of a text.

Use it

FAQ

Frequently asked questions

Quick answers to common questions about the kebab-case Converter.

How do I convert text to kebab-case?

Type or paste your text above and click kebab-case (or just start typing — this page previews kebab-case live). Copy the result when you're done.

Is this kebab-case converter free?

Yes. It's free, with no sign-up and no limit on how much text you convert.

Where is kebab-case used?

kebab-case joins words with hyphens in lowercase, the standard form for URL slugs and CSS class names.

Why do URL slugs use kebab-case instead of snake_case?

Search engines and URL conventions generally treat hyphens as word separators but often ignore or misread underscores the same way, which is why "blog-post-title" is the more SEO-friendly slug form over "blog_post_title".

Can I convert to a different case?

Yes — the same tool handles UPPERCASE, lowercase, Title Case, Sentence case, camelCase, PascalCase and snake_case. Click any of the buttons below the input, or use one of the dedicated pages below.

Is kebab-case the same as a URL slug?

Close, but a good slug also has accents removed. This tool keeps accented letters, so "Café Menu" becomes café-menu; for a plain-ASCII URL, use the Slug Generator, which strips accents as well.

Can I use kebab-case for variable names?

Not in most languages — JavaScript, Python and Java would read the hyphen as a minus sign. kebab-case is for names that are plain text: CSS class names, HTML attributes, URL paths, file names and command-line flags like --dry-run.

Does it split camelCase input?

No. It splits on spaces and punctuation only, so "backgroundColor" becomes backgroundcolor. Separate the words with a space first, as in "background Color", to get background-color.

What happens to numbers and symbols?

Digits are kept as their own word and any other symbol becomes a separator, so "Top 10 Tips & Tricks!" becomes top-10-tips-tricks.

Still have a question? Contact us

Report a problem

kebab-case Converter

What went wrong?
    or paste a screenshot