1. Ana sayfa
  3. Tasarım
  5. CSS clamp() Oluşturucu

CSS clamp() Oluşturucu

Ekran genişliğine göre en küçük ve en büyük boyut arasında akışkan şekilde ölçeklenen CSS clamp() değeri oluşturun.

Tarayıcınızda çalışır Ücretsiz
Çıktı birimi
Tarayıcınızda yerel olarak işlenir.

Yaygın görünüm alanı genişliklerinde boyut

Akışkan tipografi nedir?

Geleneksel duyarlı tasarımda yazı boyutları belirli kırılma noktalarında (breakpoint) aniden değişir. Akışkan tipografide ise yazı boyutu ekran genişliğiyle birlikte kademeli ve pürüzsüz şekilde büyür. CSS clamp() fonksiyonu bunu tek satırla mümkün kılar: clamp(minimum, tercih edilen, maksimum).

Oluşturucu ne yapar?

En küçük ekran genişliğinde istediğiniz minimum boyutu ve en büyük ekran genişliğinde istediğiniz maksimum boyutu girin. Araç, aradaki doğrusal geçişi sağlayan vw ve rem tabanlı formülü hesaplar ve kullanıma hazır clamp() bildirimini üretir.

Kullanım alanları

  • Başlık ve gövde metni boyutları
  • Kenar boşlukları ve iç boşluklar
  • Bileşenler arası mesafeler

Medya sorgularıyla dolu stil dosyalarını sadeleştirir.

CSS clamp() Oluşturucu nasıl kullanılır?

  1. Minimum ve maksimum boyutu girin.
  2. Minimum ve maksimum ekran genişliklerini belirleyin.
  3. Oluşan clamp() değerini önizleyin.
  4. CSS kodunu kopyalayın.

Neden bu aracı kullanmalısınız?

Karmaşık matematik hesaplamaları yapmadan, her ekranda dengeli görünen akışkan boyutlar elde edersiniz.

Sıkça sorulan sorular

clamp() içinde neden rem kullanılmalı?

rem, değeri kullanıcının yazı boyutu tercihiyle ilişkili tutar; bu da sabit piksellere göre erişilebilirlik açısından daha iyidir.

clamp() tüm tarayıcılarda çalışır mı?

Evet, tüm modern tarayıcılar clamp() fonksiyonunu destekler.

Tipik değerler nelerdir?

Gövde metni için 16–18px, ana başlıklar için 32–56px aralığı 360–1440px ekran genişlikleri arasında yaygın bir başlangıçtır.

İlgili araçlar

Gizli

PX REM EM Dönüştürücü

Kök ve üst öğe yazı boyutlarınıza göre pikselleri rem ve em birimine (ve tersine) çevirin.

Aracı aç
Gizli

Altın Oran Hesaplayıcı

Bir uzunluğu altın orana (φ ≈ 1,618) göre bölün ve düzen ile tipografi için φ tabanlı ölçek oluşturun.

Aracı aç
Gizli

CSS Gradyan Oluşturucu

Birden çok renk duraklı doğrusal ve dairesel CSS gradyanları canlı önizlemeyle tasarlayın.

Aracı aç
Gizli

Box Shadow Oluşturucu

Konum, bulanıklık, yayılma, renk ve iç gölge ayarlarıyla CSS box-shadow değerleri oluşturun.

Aracı aç