Text online in Kebab-Case umwandeln Wandeln Sie Text in Kebab-Case für CSS-Klassen, URLs und Dateinamen um.

📝

Kebab-Case-Konverter

Wandeln Sie Text in Kebab-Case für CSS-Klassen, URLs und Dateinamen um.

Fügen Sie Ihren Text ein

Tippen oder einfügen Sie den Text, um ihn in kebab-case umzuwandeln.

Vorschau der kebab-case-Ausgabe

Siehe sofort die Ausgabe in Kleinbuchstaben mit Bindestrichen.

Kopieren des umgewandelten Textes

Kopieren für CSS-Klassen, URLs oder Dateinamen.

Loading tool...

Why Use Kebab-Case-Konverter?

Standard für CSS-Klassennamen und benutzerdefinierte Eigenschaften
Erforderliches Format für URL-Slugs in den meisten Webframeworks
Wird für npm-Paketnamen und Git-Zweignamen verwendet
Lesbarstes Format für mehrteilige Bezeichner im Webkontext
Behandelt die Umwandlung aus jedem Eingabeformat

Common Use Cases

CSS-Klassen

Formatieren Sie Klassennamen nach BEM oder Standard-CSS-Benennungskonventionen.

URL-Slugs

Erstellen Sie SEO-freundliche URL-Pfade aus Seitentiteln oder Inhaltsüberschriften.

npm-Pakete

Wenden Sie die erforderliche Namenskonvention von npm für veröffentlichte Pakete an.

Dateibenennung

Benennen Sie Dateien in kebab-case für Angular, Vue und andere komponentenbasierte Frameworks.

Tips & Best Practices

1
CSS-Eigenschaften sind nativ in kebab-case: background-color, font-size, border-radius
2
Die BEM-Methode verwendet kebab-case mit doppelten Bindestrichen: block__element--modifier
3
kebab-case-URLs werden für SEO bevorzugt gegenüber Unterstrichen oder camelCase
4
In JavaScript können Sie kebab-case-Eigenschaften mit der Klammernotation zugreifen: obj["my-prop"]
5
Angular verwendet kebab-case für Komponentenauswahlelemente (app-user-profile)

Related Tools

camelCase-Konverter

Wandeln Sie Text in camelCase für JavaScript-Variablen und Funktionsnamen um.

📝 Text Tools

PascalCase-Konverter

Wandeln Sie Text in PascalCase um, ideal für Klassennamen und die Benennung von Komponenten.

📝 Text Tools

snake_case-Konverter

Wandeln Sie Text in snake_case für Python-Variablen und Datenbankspalten um.

📝 Text Tools

dot.case-Konverter

Wandeln Sie Text in das dot.case-Format für Konfigurationsschlüssel und Eigenschaften um.

📝 Text Tools

Slug-Generator

Erstellen Sie URL-freundliche Slugs aus Text mit anpassbaren Trennzeichen.

📝 Text Tools

Frequently Asked Questions

Q Was ist kebab-case?

kebab-case verwendet ausschließlich Kleinbuchstaben mit Bindestrichen zwischen den Wörtern: my-variable, page-title, nav-bar-item.

Q Warum kann ich kebab-case nicht für JavaScript-Variablen verwenden?

Bindestriche werden in JavaScript als Minusoperator interpretiert. Verwenden Sie stattdessen die Klammernotation (obj["my-key"]) oder camelCase.

Q Ist kebab-case besser als snake_case für URLs?

Google behandelt Bindestriche als Worttrenner, aber nicht Unterstriche, daher wird kebab-case für SEO in URLs bevorzugt.

Q Wie verwenden CSS-benutzerdefinierte Eigenschaften kebab-case?

CSS-benutzerdefinierte Eigenschaften (Variablen) verwenden kebab-case mit einem ---Präfix: --primary-color, --font-size-large.

Q Wie hängt BEM mit kebab-case zusammen?

BEM (Block Element Modifier) verwendet kebab-case als Basis, wobei __ für Elemente und -- für Modifikatoren verwendet werden.

About This Tool

Kebab-Case-Konverter is a free online tool by FreeToolkit.ai. All processing happens directly in your browser — your data never leaves your device. No registration or installation required.