Skip to main content

kebab-case Çevirici Metni CSS sınıfları, URL'ler ve dosya adları için kebab-durumuna çevirin.

Kebab-Durum Çevirici illustration
📝

Kebab-Durum Çevirici

Metni CSS sınıfları, URL'ler ve dosya adları için kebab-durumuna çevirin.

1

Metin Girin

Kebab-case'ye dönüştürmek için metni yazın veya yapıştırın.

2

Sonucu Görüntüle

Alfabe küçük harflerle ve tireler içeren çıktıyı anında görün.

3

Kopyala & Kullan

CSS sınıfları, URL'ler veya dosya adları için kopyalayın.

Loading tool...

What Is Kebab-Durum Çevirici?

Bir kebab-case dönüştürücü metni, tüm harfler küçük ve kelimelerin tirelerle ayrıldığı kebab-case formatına dönüştürür. kebab-case, CSS sınıf adları, HTML öznitelikleri, URL etiketleri, npm paket adları ve birçok çerçevedeki dosya adları için standart adlandırma kuralıdır. Örnekler: "Hello World" "hello-world" olur, "backgroundColor" "background-color" olur. İsim, kelimelerin bir tireye geçirilmiş gibi görünen görsel benzerliğinden gelir, kebab şişindeki öğelere benzer.

Why Use Kebab-Durum Çevirici?

  • CSS sınıf adları ve özel özellikler için standart
  • Çoğu web çerçevesinde URL etiketlerinin gerekli biçimi
  • npm paketi adları ve Git dal adlarında kullanılır
  • Web bağlamlarında çok kelimeli tanımlayıcılar için en okunabilir biçim
  • Herhangi bir giriş formatından dönüşümü işler

Common Use Cases

CSS Sınıfları

Sınıf adlarını BEM veya standart CSS adlandırma kurallarına göre biçimli hale getirin.

URL Etiketleri

Sayfa başlıklarından veya içerik başlıklarından SEO dostu URL yolları oluşturun.

npm Paketleri

Paket adlarını npm'in kebab-case kuralına göre biçimli hale getirin.

Dosya Adlandırma

Angular, Vue ve diğer bileşen tabanlı çerçeveler için dosya adlarını kebab-case olarak adlandırın.

Technical Guide

kebab-case dönüşümü, aynı kelime ayırma algoritmasını snake_case ile paylaşır ancak kelimeleri alt çizgi yerine tirelerle birleştirir. Giriş, boşluk karakteri, alt çizgiler, noktalama işaretleri, mevcut tireler ve büyük/küçük harf geçişleri üzerinde bölünür. Tüm kelimeler küçük harfe dönüştürülür ve tek tirelerle birleştirilir. Ardışık tireler birleştirilir ve baştaki/sondaki tireler kaldırılır. Algoritma camelCase girişini ("backgroundColor" → "background-color") doğru bir şekilde işler, ayrıca PascalCase ("PageTitle" → "page-title") ve karma formatları da işler. kebab-case tanımlayıcılarının çoğu programlama dilinde doğrudan değişken adları olarak kullanılamadığını unutmayın, çünkü tire çıkarma operatörüdür.

Tips & Best Practices

  • 1
    CSS özelliklerinin yerleşik kebab-case kullanımı: background-color, font-size, border-radius
  • 2
    BEM metodolojisi çift tireler ile kebab-case kullanır: block__element--modifier
  • 3
    kebab-case URL'ler SEO için alt çizgi veya camelCase'den daha tercih edilir
  • 4
    JavaScript'te kebab-case özellikleri parantez gösterimiyle erişin: obj["my-prop"]
  • 5
    Angular, bileşen seçicilerinde kebab-case kullanır (app-user-profile)

Related Tools

Frequently Asked Questions

Q Kebab-case nedir?
kebab-case tüm küçük harfleri tireler ile ayırarak kullanılır: my-variable, page-title, nav-bar-item.
Q Neden JavaScript değişkenleri için kebab-case kullanamıyorum?
Tireler JavaScript'te eksi operatörü olarak yorumlanır. Parantez gösterimini (obj["my-key"]) veya camelCase'i kullanın.
Q URL'lerde snake_case'den daha iyi midir kebab-case?
Google tireleri kelime ayırıcıları olarak ele alır ancak alt çizgileri değil, bu nedenle URL'ler için SEO tercih edilir.
Q CSS özel özelliklerine ne olur?
CSS özel özellikleri (değişkenler) kebab-case ile -- ön eki kullanır: --primary-color, --font-size-large.
Q BEM ve kebab-case arasındaki ilişki nedir?
BEM (Block Element Modifier), temel olarak kebab-case kullanır ve __ elementleri ve -- değiştiricileri için kullanılır.

About This Tool

Kebab-Durum Çevirici 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.