SVG آپٹیمائزر

ایڈیٹر بلاٹ ہٹا کر، فلوٹنگ پوائنٹ پاتھ کوآرڈینیٹس راؤنڈ کر کے اور whitespace سکیڑ کر SVG ویکٹر فائلیں 80% تک منیفائی اور صاف کریں — 100% براؤزر میں مقامی۔

کوئی اپ لوڈ نہیںکوئی سائن اپ نہیںبیچ پروسیسنگ
80% تک چھوٹادرستگی کوآرڈینیٹپہلے / بعد میںبیچ ZIP
ڈاؤن لوڈ
آف لائن انجن تیار ہے100% نجی ان براؤزر ورک اسپیس • صفر کلاؤڈ اپ لوڈ
100% پرائیویٹ • صفر سرور فائل اپ لوڈ

Utiliome کا کلائنٹ سائڈ SVGO ویکٹر آپٹیمائزر کیوں استعمال کریں؟

سخت پرائیویسی، فوری عمل اور صفر رگڑ کے لیے بنایا گیا۔ کوئی سبسکرپشن، پے وال یا اکاؤنٹ نہیں۔

کوآرڈینیٹ ڈیسیمل پریسیژن راؤنڈنگ

لمبی 6-ڈیسیمل Bezier پاتھ کوآرڈینیٹس (d="M12.345678...") 1–5 ڈیسیمل تک راؤنڈ کریں، خام ویکٹر بائٹ سائز 50%–75% کم بغیر نظر آنے والی مسخ کے۔

Figma، Illustrator اور Inkscape بلاٹ ہٹاتا ہے

XML پرولاگز، کمنٹس، <metadata>، xmlns:inkscape، sodipodi:*، data-name attributes اور خالی <g> یا <defs> کنٹینرز خودکار صاف۔

لائیو Before / After اسپلٹ اور کوڈ ویو

آپٹیمائزڈ ویکٹر انٹرایکٹو Before/After اسپلٹ سلائیڈر شفافیت چیکر بورڈ پر دیکھیں، یا Code View سے منیفائیڈ SVG مارک اپ کاپی کریں۔

100% مقامی پرائیویسی اور بیچ ZIP ایکسپورٹ

درجنوں آئیکنز بیک وقت براؤزر میموری میں ترتیب وار فی ٹیب پیش رفت کے ساتھ آپٹیمائز کریں اور تمام صاف .svg فائلیں ایک ZIP میں ایکسپورٹ کریں۔

Utiliome بمقابلہ روایتی کلاؤڈ متبادل

ہمارے لوکل فرسٹ WebAssembly انجن کا لیگیسی کلاؤڈ ٹولز سے موازنہ کریں۔

فیچر Utiliome (مقامی براؤزر) لیگیسی کلاؤڈ کنورٹرز
پاتھ کوآرڈینیٹ پریسیژن کنٹرول d، points، viewBox اور transforms پر ایڈجسٹ 1 سے 5 ڈیسیمل راؤنڈنگ فکسڈ جارحانہ راؤنڈنگ جو چھوٹے 16×16 آئیکنز توڑتی ہے
بصری تصدیق اور کوڈ Diff انٹرایکٹو Before/After اسپلٹ سلائیڈر + لائیو کاپی ایبل SVG کوڈ ویو اندھا فائل ڈاؤن لوڈ، ساتھ ساتھ پاتھ انسپکشن نہیں
ڈیٹا پرائیویسی اور ملکیتی آئیکنز 100% کلائنٹ سائڈ ان براؤزر عمل (صفر سرور اپ لوڈ) ملکیتی برانڈ لوگوز اور UI کٹس کلاؤڈ سرورز پر اپ لوڈ
بیچ پروسیسنگ اور لاگت لامحدود ملٹی فائل بیچ قطار + ون کلک ZIP ایکسپورٹ (100% مفت) فائل شمار کیپس، پے والز یا CLI سیٹ اپ درکار
یہ کیسے کام کرتا ہے

SVG فائلیں آن لائن 3 قدموں میں آپٹیمائز اور منیفائی کیسے کریں

سافٹ ویئر انسٹال کرنے کی ضرورت نہیں۔ سب کچھ براہِ راست ویب براؤزر میں چلتا ہے۔

1

ایک یا زیادہ SVG فائلیں چھوڑیں

.svg آئیکنز، لوگوز یا الیستریشنز ڈراپ زون میں کھینچ کر چھوڑیں۔ Utiliome ہر فائل براؤزر میں ترتیب وار پارس اور آپٹیمائز کرتا ہے۔

2

کوآرڈینیٹ پریسیژن اور آپٹیمائزیشن پاسز سیٹ کریں

Coordinate Precision سلائیڈر ایڈجسٹ کریں (2 ڈیسیمل تجویز)، میٹا ڈیٹا ہٹانا، HEX رنگ منیفیکیشن اور whitespace سکیڑنا ٹوگل کریں جبکہ Before/After اسپلٹ ویو چیک کریں۔

3

منیفائیڈ SVG کوڈ کاپی یا ZIP ڈاؤن لوڈ

'Copy SVG Code' دبا کر ان لائن HTML/JSX مارک اپ کوڈ بیس میں پیسٹ کریں، یا الگ -optimized.svg فائلیں اور بیچ ZIP آرکائیوز ڈاؤن لوڈ کریں۔

ایکسپورٹ شدہ SVG فائلیں بھاری کیوں ہیں: ویکٹر فائل اوور ہیڈ کی اناٹومی

فوری جواب: Adobe Illustrator، Figma، Inkscape اور Sketch جیسے ڈیزائن ٹولز XML ایڈیٹر namespaces، لیئر نام، پوشیدہ گروپس اور 6-ڈیسیمل فلوٹنگ پوائنٹ کوآرڈینیٹس ایمبیڈ کرتے ہیں تاکہ فائلیں بعد میں دوبارہ ایڈٹ ہوں—اکثر ویب SVG سائز 40% سے 80% بڑھاتا ہے۔

Scalable Vector Graphics (.svg) سادہ متن XML دستاویزات ہیں جو شکلیں ریاضیاتی پاتھس (<path>، <circle>، <rect>، <polygon>) سے بیان کرتی ہیں۔ ڈیسک ٹاپ ویکٹر ایڈیٹر سے آئیکن یا الیستریشن ایکسپورٹ کرتے وقت ایکسپورٹر پروڈکشن ویب پرفارمنس سے زیادہ پروجیکٹ ری امپورٹ کو ترجیح دیتا ہے:

  • 6-ڈیسیمل کوآرڈینیٹ اوور پریسیژن: M 14.892341,28.104923 C 19.000124,31.999871... جیسا پاتھ کمانڈ ہر ورتیکس پر درجنوں بائٹس ضائع کرتا ہے جو کسی اسکرین پر نظر نہیں آتے۔
  • ایڈیٹر Namespaces اور RDF میٹا ڈیٹا: Inkscape اور Illustrator <metadata>، <sodipodi:namedview>، xmlns:inkscape، data-name اور enable-background attributes داخل کرتے ہیں جنہیں براؤزرز نظرانداز کرتے ہیں۔
  • فالتو خالی کنٹینرز اور لمبے HEX کوڈز: لیئرز ان گروپ کے بعد رہ جانے والے Nested <g></g> گروپس اور 6 کریکٹر ہیکس (#ffffff بجائے #fff) غیر ضروری DOM نوڈز اور بائٹس بڑھاتے ہیں۔

کوآرڈینیٹ پریسیژن راؤنڈنگ SVG پاتھ ڈیٹا منحنی مسخ کیے بغیر کیسے سکڑاتی ہے

فوری جواب: SVG پاتھ کوآرڈینیٹس (d اور points attributes) 2 ڈیسیمل تک راؤنڈ کرنے سے پاتھ سٹرنگ لمبائی 45%–70% کم ہوتی ہے جبکہ معیاری viewBox ابعاد پر سب-ہنڈرتھ-پکسل درستگی برقرار رہتی ہے۔

پروڈکشن ویب آئیکنز اور الیستریشنز میں <path d="..." /> attribute عام طور پر کل فائل سائز کا 70% سے 90% ہوتا ہے۔ درست ڈیسیمل پریسیژن زیادہ سے زیادہ بائٹ کمپریشن اور جیومیٹرک وفاداری کا توازن ہے:

پریسیژن سیٹنگ کوآرڈینیٹ مثال مثالی viewBox اسکیل عام بائٹ بچت اور بصری اثر
1 اعشاریہ (0.1) M14.9 28.1 بڑی تصویریں (500×500+) 65%–80% چھوٹا؛ چھوٹے 16×16 آئیکنز پر کنٹرول پوائنٹس ہلکے سرک سکتے ہیں
2 اعشاریے (0.01) — طے شدہ M14.89 28.1 معیاری UI آئیکنز (24×24 سے 512×512) 50%–70% چھوٹا؛ Retina ڈسپلے پر اصل سے ریاضیاتی طور پر ناقابلِ تمیز
3 اعشاریے (0.001) M14.892 28.105 ہائی ڈینسٹی تکنیکی CAD / نقشے 35%–50% چھوٹا؛ انتہائی زوم پر باریک منحنیاں برقرار
4–5 اعشاریے M14.8923 28.1049 ذیلی یونٹ نارملائزڈ viewBox="0 0 1 1" 20%–35% چھوٹا؛ CAD پریسیژن رکھتے ہوئے پچھلے صفر کا شور ہٹاتا ہے

کینوس پر انٹرایکٹو پہلے / بعد اسپلٹ سلائیڈر سے ویکٹر آرٹ ورک ریئل ٹائم گھسیٹیں اور ایکسپورٹ سے پہلے صفر منحنی ڈرفٹ تصدیق کریں۔

SVG آپٹیمائزر بمقابلہ SVG to PNG کنورٹر: درست ویکٹر ورک فلو

فوری جواب: گرافک اسکیل ایبل .svg فائل یا ان لائن <svg> کوڈ چھوٹے KB کے ساتھ رکھنے کے لیے SVG Optimizer استعمال کریں۔ راسٹر .png بٹ میپ درکار ہو جب پلیٹ فارم SVG اپ لوڈ بلاک کرے تو SVG to PNG Converter استعمال کریں۔

دونوں ٹولز .svg ویکٹر فائلیں براؤزر میں مقامی پروسیس کرتے ہیں مگر بالکل مختلف پبلشنگ اہداف کے لیے:

ورک فلو مقصد تجویز کردہ Utiliome ٹول آؤٹ پٹ فارمیٹ اور بنیادی استعمال
ویب اور ان لائن کوڈ کے لیے .svg بائٹ سائز گھٹائیں SVG آپٹیمائزر (یہ ٹول) صاف، منیفائی .svg ویکٹر فائل یا HTML، React، Vue اور Core Web Vitals کے لیے کاپی کے قابل <svg> کوڈ
.svg کو پکسل بٹ میپ بنائیں (1x–8x) SVG سے PNG کنورٹر سوشل میڈیا، CMS اپ لوڈز اور App Store اثاثوں کے لیے الفا شفافیت والی ہائی ریزولوشن بغیر نقصان .png
آپٹیمائز SVG کو CSS Data URI بنائیں امیج سے Base64 کنورٹر صفر درخواست CSS پس منظر ایمبیڈنگ کے لیے data:image/svg+xml;base64,... سٹرنگ
SVG لوگو کو براؤزر فیویکونز میں پیک کریں فیویکون جنریٹر کئی سائز کا favicon.ico، apple-touch-icon.png اور site.webmanifest بنڈل
اکثر سوالات

SVG آپٹیمائزر FAQ اور ویکٹر پاتھ منیفیکیشن گائیڈ

Utiliome کے مفت آن لائن SVG آپٹیمائزر کے بارے میں وہ سب جو آپ کو جاننا چاہیے۔

کیا SVG آپٹیمائز کرنے سے بصری کوالٹی یا ریزولوشن کم ہوتی ہے؟

نہیں۔ آپٹیمائزیشن کے بعد SVG فائلیں 100% لامحدود اسکیل ایبل ویکٹر رہتی ہیں۔ XML کمنٹس، ایڈیٹر میٹا ڈیٹا اور whitespace ہٹانے کا صفر بصری اثر، اور پاتھ کوآرڈینیٹس 2–3 ڈیسیمل راؤنڈ کرنے سے سب-پکسل منحنی درستگی برقرار رہتی ہے۔

24×24 UI آئیکنز کے لیے کون سی کوآرڈینیٹ پریسیژن استعمال کروں؟

معیاری 16×16، 20×20 یا 24×24 UI آئیکنز (جیسے Lucide، Heroicons یا Feather) کے لیے 2 ڈیسیمل سوئیٹ سپاٹ ہے۔ اگر آئیکن بہت چھوٹا viewBox استعمال کرے (جیسے 0 0 8 8) اور Before/After سلائیڈر میں ہلکی منحنی شفٹ نظر آئے تو سلائیڈر 3 ڈیسیمل کریں۔

کیا یہ SVG Optimizer مالیشس <script> یا ایونٹ attributes ہٹاتا ہے؟

کاپی یا ڈاؤن لوڈ سے پہلے 'SVG Code' ٹیب میں عین صاف مارک اپ دیکھ سکتے ہیں۔ ہمارا آپٹیمائزر غیر معیاری XML پرولاگز، DOCTYPE اعلانات، کمنٹس اور ایڈیٹر namespaces ہٹاتا ہے جبکہ صاف ویکٹر جیومیٹری محفوظ رہتی ہے۔

کیا کئی SVG فائلیں بیک وقت آپٹیمائز کر کے ZIP ڈاؤن لوڈ کر سکتا ہوں؟

ہاں۔ پورا آئیکن سیٹ ورک اسپیس میں چھوڑیں—Utiliome ہر SVG ٹیب مقامی براؤزر میموری میں ترتیب وار پروسیس کرتا ہے، پریسیژن سیٹنگز تمام فائلوں پر لگاتے ہیں اور ایک ZIP آرکائیو ایکسپورٹ کرتے ہیں۔

SVG Optimizer کب استعمال کروں بمقابلہ SVG to PNG Converter؟

ویب سائٹس، React/Vue ایپس یا CSS پر اسکیل ایبل ویکٹر آئیکنز تعینات کرتے ہوئے چھوٹی سے چھوٹی .svg فائل کے لیے SVG Optimizer استعمال کریں۔ جب پلیٹ فارم (جیسے Twitter/X، ای میل دستخط یا Google Docs) .svg قبول نہ کرے اور اعلی DPI .png بٹ میپ مانگے تو ہمارا SVG to PNG Converter استعمال کریں۔

کیا آپٹیمائزیشن کے دوران SVG فائلیں ریموٹ سرور پر اپ لوڈ ہوتی ہیں؟

کبھی نہیں۔ ہر آپٹیمائزیشن پاس JavaScript سے 100% براؤزر میں مقامی چلتا ہے۔ ملکیتی برانڈ لوگوز اور آئیکن لائبریریز ڈیوائس نہیں چھوٹتیں۔