Softonic

SVG Yeniden Boyutlandır

Adım 1 / 2
Sonraki

SVG bir vektör biçimidir; bu yüzden çözünürlükten bağımsızdır ve her boyutta jilet gibi keskin kalır. Bir SVG’yi “yeniden boyutlandırmak” onu rasterleştirmez veya çizimi değiştirmez: bu araç yalnızca kök <svg> öğesine piksel cinsinden yeni bir width ve height değeri ayarlar, yani onun bildirilen görüntüleme boyutunu. viewBox, yollar ve her koordinat tam olduğu gibi bırakılır, böylece çizim oranlarını korur ve kalite kaybetmez. İşaretlemenizi yapıştırın, genişlik ve yüksekliği ayarlayın, sonucu önizleyin ve kopyalayın ya da indirin.

Bir SVG nasıl yeniden boyutlandırılır

  1. 1

    SVG'yi yapıştırın

    Tam `<svg>...</svg>` işaretlemesini metin kutusuna yapıştırın.

  2. 2

    Genişlik ve yüksekliği ayarlayın

    Yeni genişlik ve yüksekliği piksel cinsinden girin.

  3. 3

    Canlı önizleme

    Araç, kök `<svg>` üzerindeki `width` ve `height` değerlerini yeniden yazar (yoksa ekler) ve sonucu anında gösterir.

  4. 4

    Kopyalayın veya indirin

    Güncellenmiş işaretlemeyi panoya kopyalayın ya da `.svg` dosyası olarak kaydedin.

Görüntüleme boyutu ile viewBox

Bir SVG'nin bir görüntüleme boyutu (width/height) ve kendi koordinat sistemi (viewBox) vardır.

<svg width="200" height="200" viewBox="0 0 100 100">
    <circle cx="50" cy="50" r="40" />
</svg>

Bu SVG ekranda 200 x 200 pikseldir, oysa iç koordinatları 0 ile 100 arasında gider. r="40" olan daire viewBox'ın yaklaşık %80'ini doldurur, dolayısıyla yaklaşık 160 px genişliğinde görüntülenir. Bu araç yalnızca width ve height değerini, yani bildirilen görüntüleme boyutunu değiştirir. viewBox'a veya koordinatlara dokunmaz; çizimin oranlarını koruyup keskin kalmasının nedeni tam olarak budur: tarayıcıya aynı resmi farklı bir boyutta çizmesini söylüyorsunuz, yeniden çizmesini değil.

Boyutu değiştirdikten sonra bir SVG neden aynı görünebilir

SVG <img src="simge.svg" width="500"> gibi bir şeyle yerleştirilmiş ya da CSS ile boyutlandırılmışsa, çevredeki sayfa görüntüleme boyutunu denetler ve dosyadaki width/height değerini geçersiz kılar. Bu durumda boyutu, SVG'nin kullanıldığı yerde değiştirin (<img>, CSS veya kapsayıcıda), yalnızca işaretlemenin içinde değil.

Çizgiler ve metin keskin kalır

Hiçbir şey rasterleştirilmediği için metin gerçek vektör metni olarak kalır ve çizgiler her boyutta pürüzsüz kalır. Çizgi kalınlıkları koordinat sisteminde tanımlıdır, bu yüzden çizimle birlikte ölçeklenir. Bir çizginin, boyuttan bağımsız olarak aynı görsel kalınlığı korumasını istiyorsanız, yeniden boyutlandırmadan önce kaynağınızda o öğeye vector-effect="non-scaling-stroke" ekleyin.

İşaretlemeyi temiz tutun

Figma, Illustrator veya Sketch'ten dışa aktarılan SVG'ler çoğu zaman fazladan yük taşır: düzenleyici ad alanları (sodipodi:, inkscape:), gizli meta veriler ve kullanılmayan <defs>. Bu araç, boyut dışında işaretlemenizi olduğu gibi bırakır. Gereksiz yükü ayıklamak için dosyayı, yeniden boyutlandırmadan önce veya sonra SVGO gibi bir iyileştiriciden geçirin.

Sık Sorulan Sorular

Hayır. Yalnızca kök <svg> üzerindeki width ve height değerini ayarlar. viewBox, yollar ve her koordinat dokunulmadan kalır, böylece çizim tam oranlarını korur.

Genellikle boyutu sayfa denetler: bir <img> genişliği, bir CSS kuralı veya bir kapsayıcı dosyanın kendi boyutlarını geçersiz kılar. Boyutu, SVG’nin kullanıldığı yerde değiştirin, yalnızca işaretlemede değil.

Evet. SVG bir vektör biçimidir, bu yüzden hiçbir şey rasterleştirilmez ve metin ile çizgiler her boyutta keskin kalır. Kaynak dosya metni zaten yollara dönüştürdüyse, o da diğer şekiller gibi ölçeklenir ve yine keskin kalır.

Evet. Yalnızca width ve height değiştirilir; <animate>, <script>, olay işleyicileri ve SVG içindeki CSS olduğu gibi bırakılır.

İşaretleme, yeniden boyutlandırılmış önizlemeyi oluşturmak için sunucumuza gönderilir ve istekten sonra saklanmaz. Kaydedilmez veya paylaşılmaz.

İlgili Araçlar

Material Design Renk Seçici

Material Design renk paletini gezin. Herhangi bir tonu (50'den A700'e kadar) tek dokunuşla HEX, RGB veya HSL biçiminde kopyalayın.

Çizgili Kağıt Oluşturucu

Ücretsiz yazdırılabilir çizgili kağıt oluşturun. Kolej, geniş veya dar çizgi seçin, satır aralığını mm cinsinden ayarlayın, kağıt boyutunu ve bir kenar boşluğu çizgisi belirleyin, ardından yazdırın veya SVG olarak indirin.

Kanaviçe Şablonu Oluşturucu

JPEG, PNG veya WebP görselini 10–150 ilmek, 2–40 özel renk, semboller, kesin sayımlar ve kumaş ölçüleri içeren yazdırılabilir kanaviçe şemasına dönüştürün.

Kareli kağıt oluşturucu

Çevrimiçi yazdırılabilir kareli kağıt oluşturun: kare veya nokta ızgarası seçin, aralığı mm cinsinden ayarlayın, A4 veya Letter ile özel bir çizgi rengi belirleyin, ardından yazdırın veya net bir SVG indirin.

Fotoğraflardaki Yüzleri Çevrimiçi Bulanıklaştırın

Yüzlerin veya hassas ayrıntıların üzerine kutular çizin, ardından bulanıklaştırın, pikselleştirin ya da siyah kutuyla kapatın. İşlem tarayıcıda yapılır ve sonuç JPEG olarak indirilir.

Görüntü Formatı Dönüştürücü

Görselleri doğrudan tarayıcıda JPG, PNG veya WebP biçimine dönüştürün; kayıplı biçimlerde kaliteyi siz kontrol edin, PNG ve WebP'de şeffaflık korunur.

Araç diğer dillerde mevcuttur