Kebab Case Converter
Convert text to kebab-case online — the standard for CSS class names, HTML attributes, and URL slugs. Free, instant, client-side case converter.
🔒 100% Client-Side Processing
Your data is processed entirely in your browser and never transmitted to any server.
0 / 100M Limit
Common Use Cases
Creating CSS class names
Convert component or feature names into the kebab-case that stylesheets, BEM conventions, and design tokens use.
Building URL slugs
Turn a page or article title into a lowercase hyphenated path segment that is URL-safe and readable.
Naming files and packages
Standardize repo file names, npm package names, and Vue component files to the ecosystem convention.
Frequently Asked Questions
- Why is kebab-case used for URLs and CSS?
- Hyphens are URL-safe without escaping, and Google treats them as word separators (unlike underscores), which is better for SEO slugs. CSS properties and class names adopted the same convention (background-color, nav-item).
- Can I use kebab-case for JavaScript variables?
- No — the hyphen parses as a minus operator, so my-variable is invalid JavaScript. Use kebab-case for CSS classes, HTML attributes, file names, and URL slugs; use camelCase inside JavaScript code.
- How does kebab-case compare to camelCase and snake_case?
- Same words, different separators and capitalization: kebab-case (user-profile) joins with hyphens, all lowercase; camelCase (userProfile) has no separator and capitalizes internal words; snake_case (user_profile) joins with underscores, all lowercase. Use the Camel Case Converter or Snake Case Converter to convert straight to those instead.
- Is my data private when I use this tool?
- Yes. This tool runs entirely in your browser using client-side JavaScript — nothing you type is transmitted to, logged by, or stored on any server. You can safely process confidential text, tokens, or code.