IMG.DIY / Ekstralar / Görselden SVG'ye

Görselden SVG'ye

Düz bir logoyu, ikonu ya da çizgi çizimi ölçeklenebilir bir SVG'ye dönüştürün — tarayıcınızda yerel olarak izlenir.

Görselden SVG'ye visual example
Önce gizlilik: hiçbir şey yüklenmez.

From input to result

Choose a file, make the change, and download the result. Processing stays in your browser.

Görselden SVG'ye: 1 · Choose input
1 · Choose input
Görselden SVG'ye: 2 · Adjust and process
2 · Adjust and process
Görselden SVG'ye: 3 · Download result
3 · Download result

Yalnızca küçük bir PNG olarak var olan bir logonuz ya da ikonunuz var ve onu her boyutta net mi istiyorsunuz? Bu araç, görseli bir SVG'ye izler — şekillerden ve yollardan oluşan, bulanıklaşmadan herhangi bir boyuta ölçeklenen bir vektör. Düzden ayrıntılıya bir stil seçin ve SVG'yi indirin.

İzleme, imagetracer motoruyla tarayıcınızda çalışır, böylece hiçbir şey yüklenmez. Sınırlar konusunda dürüst olalım: düz logolarda, ikonlarda ve çizgi grafiklerinde parlar. Fotoğraflar da izlenir ama devasa, lekeli dosyalar üretir — fotoğraflar için SVG değil bir raster format istersiniz.

Nasıl kullanılır

  1. Bir görsel ekleyinBir PNG ya da JPG logo, ikon ya da eskiz sürükleyin.
  2. Bir stil seçinDüz/logo, ayrıntılı, posterize ya da siyah-beyaz — önizleme canlı güncellenir.
  3. SVG'yi indirinHerhangi bir boyuta ölçeklenmeye hazır vektörü kaydedin.

Bu araç bir raster görseli — bir PNG ya da JPG — doğrudan tarayıcınızda bir vektör SVG'ye çevirir. Resmi kendi makinenizdeki bir tuvalden okur ve içindeki şekilleri bulmak için imagetracer motorunu kullanarak her renk bölgesinin çevresine vektör yolları çizer. Buraya ulaşmanın amacı şudur: bir SVG piksellerden değil, geometriden yapılmıştır, bu yüzden ister bir favicon ister bir reklam panosu olsun kusursuz keskin kalır; oysa bir PNG büyüttüğünüz an bulanıklaşır. Bir görsel bırakırsınız, bir stil ön ayarı seçersiniz, önce/sonra önizlemesini karşılaştırırsınız ve SVG'yi indirirsiniz.

Düz, temiz kenarlı girdilerde gerçekten iyidir: logolar, simgeler, basit illüstrasyonlar, çizgi sanatı, el yazısı. Bunların küçük bir paleti ve belirgin kenarları vardır, ki bir izleyicinin iyi okuduğu tam olarak budur; böylece bir avuç şekilden oluşan düzenli, düzenlenebilir bir SVG elde edersiniz. Ön ayarlar sonucu yönlendirir — Düz/logo renkleri düşük tutar, Ayrıntılı daha fazlasına izin verir, Posterize görseli belirgin düz alanlara bantlar, Siyah beyaz onu iki tona indirir. Her şey yerel olarak çalışır: hiçbir şey yüklenmez, hesap yoktur ve bir kez yüklendikten sonra çevrimdışı çalışır. Bu gerçek bir izlemedir, bir yapay zekâ yeniden çizimi değil — daha temiz bir resim uydurmak yerine sizin piksellerinizi izler.

İnsanlar bunu ne için kullanıyor

Düz bir PNG logoyu, favicondan reklam panosuna keskin kalan bir SVG'ye dönüştürün

Sonradan yeniden renklendirebilmek için basit bir simgeyi ya da çizgi sanatı çizimini vektörleştirin

El yazısını ya da bir imza konturunu düzenlenebilir bir vektör şekle çevirin

Keskin kenarların her boyutta önemli olduğu baskı için iki ya da üç renkli bir işareti izleyin

Yüksek çözünürlüklü ekranlarda temiz ölçeklensin diye bir illüstrasyonu SVG'ye alın

Küçük, bulanık bir logoyu bir düzenleyicide temizleyebileceğiniz vektör yolları olarak yeniden inşa edin

Bir şeklin resmi ile şeklin kendisi arasındaki fark

Bir PNG ya da JPG bir piksel ızgarasıdır. Onu doğal boyutunun ötesine büyütün ve ızgara görünür olur: kenarlar merdiven basamaklarına dönüşür, keskin bir logo yumuşar ve tarayıcının yapabileceği hiçbir şey yoktur çünkü ayrıntı hiçbir zaman orada değildi. Bir SVG tamamen başka bir şey saklar — gerçek geometriyi. Bir daire bir daire olarak, bir eğri bir yol olarak, bir dolgu bir renk olarak tanımlanır. Şekiller piksel değil matematik olduğu için, herhangi bir boyutta keskin yeniden çizilirler. Bir kartvizite, bir reklam panosuna ve bir favicona koymayı planladığınız bir logonun gerçekten bir SVG olmak istemesinin nedeni budur: tek dosya, bulanıklık yok, her ölçekte.

Bu araç bir raster görseli o tür bir vektör dosyasına dönüştürür ve tüm işi tarayıcınızda yapar. Bir PNG ya da JPG seçersiniz, o şekilleri imagetracer motoruyla izler ve geriye bir SVG alırsınız. Görsel kendi makinenizdeki bir tuvalden okunur — hiçbir şey yüklenmez, hesap yok ve sayfa bir kez yüklendikten sonra ağ kapalıyken çalışmaya devam eder. Bıraktığınız resim cihazınızdan asla ayrılmaz.

Gerçekten iyi olduğu şey

İzleme, giriş düz ve temiz-kenarlı olduğunda parlar: bir logo, bir simge, basit bir illüstrasyon, çizgi sanatı, bir el yazısı parçası. Bunların az sayıda sağlam rengi ve belirgin sınırları vardır, ki bu bir izleyicinin iyi okuduğu tam şeydir. Her renk bölgesini bulur, etrafına bir yol çizer ve sonuç, bir avuç şekilden oluşan derli toplu bir SVG'dir — küçük dosya, keskin kenarlar, sonradan düzenlemesi kolay.

Hazır ayarlar izleyicinin görselinizi nasıl okuyacağını yönlendirir. Düz / logo renk sayısını düşük ve şekilleri basit tutar, iki ya da üç renkli bir işaret için en iyisi. Ayrıntılı daha fazla nüans taşıyan illüstrasyonlar için daha fazla renge ve daha ince yollara izin verir. Posterleştirilmiş görseli cesur düz bantlara çökertir, grafik bir afiş görünümü. Siyah beyaz her şeyi iki tona indirger, çizgi sanatı, damgalar ve siluetler için ideal. Daha az renk daha küçük, daha temiz bir dosya demektir; daha fazla renk inceliği yakalar ama yol ve ağırlık ekler. Aynı görselde iki hazır ayar deneyip karşılaştırmaya değer — öncesi/sonrası önizleme size orijinali ve izlemeyi yan yana gösterir; böylece indirmeden önce yargılayabilirsiniz.

Fotoğraflar hakkında dürüst uyarı

Bir fotoğraf izlenir, ama neredeyse kesinlikle izlenmesini istemezsiniz. Bir fotoğrafın binlerce hafifçe farklı rengi ve hiç sert kenarı yoktur — bir izleyici tüm bunları yığılmış, üst üste binen düz renk lekeleriyle yaklaşık olarak temsil etmek zorundadır. Çıkan SVG devasadır (çoğu zaman orijinal JPG'den çok daha büyük), fotoğrafik yerine bulaşmış ve posterleştirilmiş görünür ve düzenlemesi berbattır. Sürekli-tonlu herhangi bir şey için — insanlar, manzara, ürün fotoğrafçılığı — bir raster format doğru yanıttır ve bunun için sıkıştırıcılar ve dönüştürücüler vardır. SVG şekiller içindir, fotoğraflar için değil. Bu araç bir fotoğrafı izlemenizi durdurmaz, ama önizleme sorunu bariz yapar.

Açık olmaya değer bir şey daha: bu gerçek izlemedir. Verdiğiniz pikselleri okur ve onları izleyen vektör yolları çizer. Logonuzu yeni bir şeye yeniden çizen ya da "temizleyen" bir yapay zeka değildir. Kaynak bulanık, düşük çözünürlüklü ya da gürültülüyse, izleme bunu miras alır — temiz, keskin, az-renkli bir giriş temiz bir sonuç verir ve dağınık bir giriş dağınık yollar verir.

İzledikten sonra yeniden renklendir ve düzenle

Çıktı, adlandırılmış yollardan ve dolgulardan oluşan normal bir SVG olduğu için, izlemenin ürettiği renklere takılı kalmazsınız. Dosyayı bir vektör düzenleyicide açın — Illustrator, Inkscape, Figma ya da hatta bir metin düzenleyici — ve tek bir dolguyu değiştirerek bütün bir bölgeyi yeniden renklendirebilir, bir yolu itebilir, izleyicinin yakaladığı başıboş bir şekli silebilir ya da renkleri tam marka hex'inize ayarlayabilirsiniz. Bir logoyu vektör biçimine sokmanın gerçek avantajı budur: sabit bir resim olmaktan çıkar ve sahip olduğunuz, herhangi bir boyutta, bulanıklıksız, düzenlenebilir bir nesne olur.

Neden IMG.DIY

Raster → vektör

PNG/JPG'yi ölçeklenebilir SVG yollarına dönüştürür.

Stil hazır ayarları

Düz, ayrıntılı, posterize ya da S&B.

Temizce ölçeklenir

Gerilmiş bir rasterin aksine her boyutta net.

Gizli

Yerel olarak izlenir — asla yüklenmez.

SSS

Hangi görseller en iyi çalışır?
Düz logolar, ikonlar, sade çizimler ve çizgi grafikler. Daha az renk ve temiz kenarlar, temiz ve kompakt SVG'ler verir.
Fotoğrafım neden devasa bir SVG oluşturuyor?
Fotoğraflarda binlerce ince renk bölgesi vardır, bu yüzden izleme çok sayıda yol oluşturur. SVG fotoğraflar için yanlış formattır — onları JPG/PNG olarak tutun.
SVG'yi sonradan yeniden renklendirebilir miyim?
Evet. Çıktı standart SVG yollarıdır, böylece onu bir vektör editöründe açıp dolguları, boyutları ve renkleri değiştirebilirsiniz.
Görselim yükleniyor mu?
Hayır. İzleme tamamen tarayıcınızda çalışır; görsel cihazınızdan asla çıkmaz.
Ne tür bir görsel en iyi izlemeyi verir?
Az sayıda düz renge sahip, düz ve temiz kenarlı bir şey — bir logo, simge, basit illüstrasyon ya da çizgi sanatı. İzleyici her renk bloğunu bulur ve çevresine sıkı bir yol çizer, bu yüzden az renkli, keskin, yüksek çözünürlüklü bir kaynak küçük, keskin bir SVG verir. Yumuşak gradyanlar ve karmaşık ayrıntı onu şaşırtır ve dağınıklık ekler.
Bir fotoğrafı izlemek neden bu kadar büyük bir dosya yapıyor?
Bir fotoğrafın binlerce hafifçe farklı rengi ve hiçbir sert kenarı vardır, bu yüzden izleyicinin hepsini üst üste binmiş, düz renkli lekelerle yaklaşık olarak temsil etmesi gerekir. Bu, orijinal JPG'den çok daha büyük, fotoğrafik değil, bulaşmış görünen bir SVG üretir. Fotoğraflar için bir raster biçimi tutun ve sıkıştırın — SVG, sürekli ton için değil, şekiller içindir.
İzledikten sonra renkleri değiştirebilir miyim?
Evet. Çıktı, adlandırılmış yollardan ve dolgulardan oluşan normal bir SVG'dir, bu yüzden onu Illustrator, Inkscape ya da Figma gibi bir vektör düzenleyicide açın ve tek bir dolguyu düzenleyerek tüm bir bölgenin rengini değiştirin. Tam marka hex değerleri belirleyebilir, izlemenin yakaladığı başıboş şekilleri silebilir ya da yolları dürtebilirsiniz — izleme, kilitli bir sonuç değil, bir başlangıç noktasıdır.
Görselim herhangi bir yere yüklenir mi?
Hayır. Tüm izleme tarayıcınızda çalışır — görsel kendi makinenizdeki bir tuvalden okunur ve asla cihazınızdan ayrılmaz. Hesap ve sunucu yoktur ve sayfa yüklendikten sonra ağ kapalıyken çalışır, ki bu başka bir yere göndermek istemediğiniz bir logo için değerlidir.

İlgili araçlar

Rehberler ve ipuçları