Tailwind CSS v4.0 yayımlandı

• Tailwind CSS v4.0 yayımlandı

  • Performans ve esnekliği optimize eden yeni sürüm, modern web platformunun sunduğu gelişmelerden en üst düzeyde yararlanıyor
  • Yeni yüksek performanslı motor sayesinde tam derleme hızı 5 kata kadar, artımlı derleme hızı ise 100 kattan fazla arttı
  • Modern web için en yeni CSS özelliklerinden yararlanacak şekilde tasarlandı

• Yeni yüksek performanslı motor

  • Tailwind CSS v4.0, framework'ün baştan aşağı yeniden yazılmış hali olarak mimariyi optimize edip hızı en üst düzeye çıkarıyor
  • Artımlı derlemeler 100 kattan fazla hızlanarak mikrosaniye düzeyinde tamamlanıyor

• Modern web için tasarım

  • Native cascade layer'lar, kayıtlı özel özellikler ve color-mix() gibi en yeni CSS özelliklerinden yararlanıyor
  • Mantıksal özellikler kullanarak RTL desteğini sadeleştiriyor ve üretilen CSS boyutunu küçültüyor

• Basitleştirilmiş kurulum

  • Kurulum süreci sadeleştirildi; bağımlılıklar azaltıldı ve CSS dosyasına yalnızca tek satırlık bir kod eklemek yeterli
  • Harici eklenti olmadan @import kuralını yerleşik olarak sunuyor

• Vite eklentisi

  • Vite kullanıcıları Tailwind'i entegre etmek için @tailwindcss/vite kullanabiliyor
  • Vite eklentisi kullanıldığında performans daha da artıyor

• Otomatik içerik algılama

  • Şablon dosyalarını otomatik olarak algılıyor, yapılandırma gerektirmiyor
  • Gereksiz taramaları önlemek için .gitignore dosyasındaki öğeleri otomatik olarak yok sayıyor

• Yerleşik import desteği

  • @import kullanarak diğer CSS dosyalarını satır içine alabiliyor
  • Tailwind CSS için optimize edilmiş import sistemi performansı daha da artırıyor

• CSS öncelikli yapılandırma

  • Proje JavaScript yerine CSS içinde yapılandırılabiliyor
  • tailwind.config.js dosyası olmadan doğrudan CSS dosyası içinde özelleştirme yapılabiliyor

• CSS tema değişkenleri

  • Tasarım token'larını CSS değişkenleri olarak sunarak çalışma zamanında kolayca başvurulabilmesini sağlıyor

• Dinamik utility değerleri ve varyantlar

  • Çeşitli utility'lerin ve varyantların keyfi değerleri kabul etmesi sadeleştirildi
  • Grid boyutları veya özel veri öznitelikleri kolayca ayarlanabiliyor

• Modernize edilmiş P3 renk paleti

  • Varsayılan renk paleti rgb'den oklch'ye yükseltilerek daha canlı renkler sunuluyor

• Container query'ler

  • Öğe stillerini container boyutuna göre ayarlamayı sağlayan API'yi yerleşik olarak sunuyor

• Yeni 3D dönüşüm utility'leri

  • Öğeleri 3D uzayda dönüştürmeyi sağlayan API eklendi

• Genişletilmiş gradient API'si

  • Linear, conic ve radial gradient oluşturmaya yarayan utility'ler eklendi

• @starting-style desteği

  • JavaScript olmadan, öğe ilk kez görüntülendiğinde özellikleri geçişli olarak değiştirme yeteneği eklendi

• not-* varyantı

  • CSS :not() sözde sınıfı desteği eklendi

• Eklenen yeni utility'ler ve varyantlar

  • inset-shadow-*, field-sizing, color-scheme gibi çeşitli yeni utility'ler ve varyantlar eklendi

Tailwind CSS v4.0, performans ve esnekliği en üst düzeye çıkaran en yeni sürüm olarak çok sayıda yeni özellik ve iyileştirme sunuyor.

[GN⁺]

Hacker News görüşleri

• Tailwind v4'ün gelişimi olumlu değerlendiriliyor; CSS değişkenlerini ve yalnızca CSS ile yapılandırmayı desteklemesi büyük bir avantaj. Tailwind'in artık bir yardımcı araç olarak rolünü iyi yerine getirdiği düşünülüyor

• CSS geçmişe kıyasla daha kullanıcı dostu hale geldi ve stil özelliklerini doğrudan HTML'de kullanmak daha basit olabilir. Ancak bazıları hâlâ style özniteliğinden kaçınmak istiyor

• Tailwind ile stilleri tek bir yerde okuyabilmek beğeniliyor. Sınıf adları uzun olsa da, stilleri kolayca değiştirebilmek onu kullanışlı kılıyor

• Tailwind ile ilk karşılaşıldığında CSS'yi yeniden öğrenmek zorunda olmak göz korkutucuydu. Ancak ekip çalışması ve ölçeklenebilirlik açısından faydalı olduğu anlaşılıyor. Yine de temel stil dosyaları tercih ediliyor

• Tailwind kullanılan projelerde sezgisel yapısı ve iyi belgelenmiş olması beğenildi. Stil adları üzerine düşünmek zorunda kalmamak zaman kazandırıyor

• Tailwind'in son güncellemesiyle derleme süreleri kısaldı ve artık JS yapılandırmasına gerek kalmadı. CSS artık işlerin çoğunu yapabilir hale geldi

• Tailwind denenmek istendi ancak ortaya çıkan sonuç Bootstrap'ten daha iyi değildi. Tasarımcı olmadan da iyi sonuçlar elde etmenin yolu aranıyor

• Tailwind'in temiz ama genel tasarımı yaygın şekilde görülüyor. Bu da Tailwind'in satır içi stil yaklaşımının avantajlarını ve sınırlarını gösteriyor

• Tailwind v4'e güncelleme mevcut uygulamaları etkiledi. Uyumluluk sorunları nedeniyle v3'ü kullanmaya devam etmek veya derleme betiklerini değiştirmek gerekiyor