CSS'te text-transform özelliği, bir metnin harflerinin nasıl gösterileceğini belirlemek için kullanılır. Bu özellik, metni büyük harfe çevirme, küçük harfe çevirme veya her kelimenin ilk harfini büyük yapma gibi çeşitli dönüşümler uygulamanıza olanak tanır. text-transform özelliği genellikle başlıklar, düğme metinleri veya herhangi bir metin bloğunda tutarlı bir yazım biçimi sağlamak için kullanılır.

text-transform Değerleri

none: Bu değer, metni olduğu gibi bırakır ve herhangi bir dönüşüm uygulamaz.

capitalize: Her kelimenin ilk harfini büyük yapar.

uppercase: Tüm harfleri büyük harfe çevirir.

lowercase: Tüm harfleri küçük harfe çevirir.

.text-normal {
  text-transform: none;
}

.text-capitalize {
  text-transform: capitalize;
}

.text-uppercase {
  text-transform: uppercase;
}

.text-lowercase {
  text-transform: lowercase;
}

<p class="text-normal">Normal metin. Bu metin dönüşüme uğramaz.</p>
<p class="text-capitalize">capitalize metin. her kelimenin ilk harfi büyük olur.</p>
<p class="text-uppercase">uppercase METİN. TÜM HARFLER BÜYÜK OLUR.</p>
<p class="text-lowercase">LOWERCASE METİN. tüm harfler küçük olur.</p>

Tailwind CSS:

<p class="normal-case ...">The quick brown fox ...</p>
<p class="uppercase ...">The quick brown fox ...</p>
<p class="lowercase ...">The quick brown fox ...</p>
<p class="capitalize ...">The quick brown fox ...</p>