kebab-case Converter

Convert text to kebab-case for URLs, CSS class names, and filenames.

What is the Free kebab-case Converter?

The free kebab-case Converter transforms any text into kebab-case — all lowercase with words joined by hyphens, making it perfect for URL slugs, CSS class names, and HTML attributes. Paste into the "Input text" field and see the "kebab-case output" immediately.

  • Convert component or module names to kebab-case for Vue, Svelte, or Web Components.
  • Generate CSS class names and custom property names from natural-language descriptions.
  • Transform page titles into URL slugs for a CMS or static site generator.
  • Rename HTML5 data attributes (data-my-value) from camelCase sources.
  • Convert file names to kebab-case for consistent project naming.

How to Use the Free kebab-case Converter

  1. 1 Type or paste your text into the "Input text" field.
  2. 2 The "kebab-case output" updates instantly — all lowercase, hyphens between words.
  3. 3 Click Copy to use the result.

Key Features

  • 🍢
    kebab-case output
    All-lowercase, hyphen-separated — the standard for CSS, URLs, and web component names.
  • 🔄
    All-format input
    Handles spaces, camelCase, PascalCase, snake_case, and mixed input.
  • Live conversion
    Output refreshes with every keystroke.
  • 🔒
    Browser-only
    Nothing is uploaded. All conversion runs locally.

Example Usage

Example Input
getUserProfileData
FirstName
total item count
Example Output
get-user-profile-data
first-name
total-item-count

Frequently Asked Questions about the Free kebab-case Converter

What is the free kebab-case Converter?
Convert text to kebab-case for URLs, CSS class names, and filenames.
Is the kebab-case Converter free to use?
Yes, the kebab-case Converter is completely free. No account, subscription, or signup is required — ever.
Does my data get uploaded anywhere?
No. The kebab-case Converter runs entirely in your browser. Your data is never sent to any server.
Does it work offline?
Yes. Once the page has loaded, the tool works without an internet connection.
Which browsers are supported?
All modern browsers — Chrome, Firefox, Safari, and Edge. No plugins or extensions required.
What is kebab-case used for?
kebab-case is standard for CSS class names, HTML attributes, URL slugs, npm package names, and web component tag names (e.g. <my-button>).
Is kebab-case the same as URL slugs?
Yes — URL slugs are a subset of kebab-case. A slug is a kebab-case string that is also URL-safe, which kebab-case strings always are.

Related Free Text Tools