مبدل رایگان

SVG به PNG مبدل

فایل های SVG برداری را به تصاویر رستر PNG با کیفیت بالا تبدیل کنید. مقیاس خروجی و رنگ پس زمینه را به راحتی در مرورگر خود سفارشی کنید.

SVG را در اینجا بکشید و رها کنید

تا 50 مگابایت پشتیبانی می کند

یا

درباره این ابزار

SVG (گرافیک برداری مقیاس پذیر) تصاویر را به عنوان مجموعه ای از موارد اولیه هندسی - مسیرها، اشکال، متن، گرادیان ها - توصیف می کند که به هر اندازه ای بدون کاهش کیفیت مقیاس می شوند. PNG یک شبکه پیکسل مستطیلی را با وضوح ثابت ذخیره می کند. تبدیل SVG به PNG یک مرحله شطرنجی سازی است: دستورالعمل های ترسیم SVG در اندازه پیکسل انتخاب شده ارزیابی می شوند و بیت مپ حاصل به صورت PNG کدگذاری می شود. خروجی در اندازه ای که شما مشخص کرده اید واضح به نظر می رسد اما اگر بزرگتر شود پیکسل می شود.

این مبدل SVG را با استفاده از موتور SVG داخلی مرورگر رندر می کند. SVG در یک عنصر Image بارگذاری می شود، بر روی بوم HTML5 در ابعاد خروجی انتخاب شده کشیده می شود و به عنوان PNG از طریق canvas.toBlob صادر می شود. از آنجایی که مرورگر شطرنجی‌سازی را انجام می‌دهد، ویژگی‌های پیچیده SVG - گرادیان‌ها، فیلترها، ماسک‌ها، انیمیشن‌ها به‌عنوان یک فریم استاتیک - به همان شکلی که در یک صفحه وب واقعی ارائه می‌شوند، ارائه می‌شوند.

مهمترین تصمیم در تبدیل SVG به PNG اندازه هدف است. SVG مستقل از رزولوشن است، بنابراین انتخاب یک اندازه PNG که با استفاده واقعی مطابقت داشته باشد، از تهیه بیش از حد (فایل‌های بزرگ برای آیکون‌های با اندازه تصویر کوچک) و تهیه کمتر (خروجی تار هنگامی که بعداً بزرگ‌تر می‌شود) جلوگیری می‌کند. اهداف رایج: 32×32 یا 64×64 برای نمادها، 256×256 یا 512×512 برای لوگوها، 1024×1024 برای گرافیک قهرمان، 2048×2048 برای دارایی های با کیفیت شبکیه چشم.

چرا SVG را به PNG تبدیل کنیم؟

SVG برای وب و ابزارهای طراحی مدرن فوق العاده است اما برای بسیاری از زمینه های دیگر وحشتناک است. کلاینت های ایمیل SVG را به صورت متناقض ارائه می کنند. برخی آن را به عنوان یک خطر امنیتی مسدود می کنند. نرم افزارهای اداری قدیمی، CMS های خاص، خدمات شخص ثالث و تقریباً تمام خطوط لوله چاپ عکس به هیچ وجه SVG را نمی پذیرند. تبدیل به PNG یک رستر پذیرفته شده جهانی تولید می کند که در اندازه انتخاب شده یکسان به نظر می رسد.

PNG همچنین بدون وابستگی به رندر SVG گیرنده، به طور قابل اعتمادی در اسناد اداری، اسلایدها و فایل‌های PDF تعبیه می‌شود. برای آرم‌ها و گرافیک‌هایی که باید در بسیاری از پلتفرم‌ها به‌طور مداوم ظاهر شوند، PNG انتخاب مطمئن‌تری است – حتی اگر استقلال رزولوشن را که در وهله اول SVG را جذاب می‌کند، از دست بدهد.

نحوه استفاده

اندازه هدف خود را انتخاب کنید، رندر کنید. مرورگر شطرنجی سازی را انجام می دهد.

  1. فایل SVG را آپلود کنید: یک SVG را به قسمت آپلود بکشید یا برای مرور کلیک کنید. فایل های تا 50 مگابایت پشتیبانی می شوند، اگرچه SVG های معمولی بسیار کمتر از 1 مگابایت هستند. SVGهای خودکفا بهترین کار را دارند. SVGهایی که تصاویر خارجی را از طریق xlink:href به URL های راه دور ارجاع می دهند، ممکن است ناقص شوند.
  2. اندازه خروجی را انتخاب کنید: پیش‌فرض ابعاد ViewBox اصلی SVG است، اما می‌توانید به هر اندازه پیکسلی تغییر دهید. اندازه ای را انتخاب کنید که با استفاده واقعی شما مطابقت داشته باشد — از تولید 4K PNG برای نمادهایی که با ابعاد 32×32 نمایش داده می شوند، خودداری کنید.
  3. رندر کنید: مرورگر SVG را تجزیه می کند، آن را روی بوم در ابعاد درخواستی می کشد و بوم را به صورت PNG صادر می کند. SVGهای پیچیده با فیلترها یا تعداد مسیرهای بزرگ ممکن است یک لحظه طول بکشد. آیکون های ساده فورا ارائه می شوند.
  4. PNG را دانلود کنید: فایل را ذخیره کنید. شفافیت در SVG (هر چیزی خارج از اشکال ترسیم شده) به عنوان یک کانال آلفا در PNG حفظ می شود.

موارد استفاده رایج

جزئیات فنی

SVG (توصیه W3C) یک فرمت برداری مبتنی بر XML با عناصر مسیرها، اشکال اصلی (مستقیم، دایره، بیضی، خط، چند ضلعی، چند خط)، متن، گرادیان (linearGradient، radialGradient)، فیلترها، ماسک‌ها و مسیرهای کلیپ است. مرورگر XML را تجزیه می‌کند، یک DOM می‌سازد، CSS را اعمال می‌کند، و نتیجه را در حین رندر کردن صفحه شطرنجی می‌کند.

این مبدل SVG را در یک HTMLImageElement بارگذاری می‌کند (که مسیر معمولی رندر SVG-as-image مرورگر را راه‌اندازی می‌کند)، سپس آن را از طریق drawImage به بوم می‌کشد. بوم با استفاده از canvas.toBlob ('image/png') به صورت PNG صادر می شود. پیکسل های دقیق در خروجی با آنچه که SVG با همان اندازه در برگه مرورگر ارائه می کند مطابقت دارد.

موارد لبه: SVG با استفاده از ForeignObject همیشه وقتی از طریق عنصر Image استفاده می شود پشتیبانی نمی شود. ارجاع SVG به منابع خارجی (xlink:href به یک دامنه دیگر) ممکن است به دلیل CORS بارگیری نشود. انیمیشن های SMIL و انیمیشن های مبتنی بر جاوا اسکریپت فقط به عنوان فریم اولیه ارائه می شوند.

بهترین شیوه ها

سوالات متداول

آیا SVG من با تبدیل به PNG کیفیت خود را از دست می دهد؟
تبدیل برداری به شطرنجی به این معنی است که تصویر مبتنی بر پیکسل می شود و دیگر نمی تواند تا بی نهایت مقیاس شود. وضوح بالا را انتخاب کنید تا مطمئن شوید PNG در اندازه صفحه نمایش مورد نظر شما واضح به نظر می رسد.
فرمت PNG برای چه مواردی استفاده می شود؟
PNG (Portable Network Graphics) در درجه اول برای گرافیک هایی با شفافیت، اسکرین شات ها، آرم ها، آیکون ها استفاده می شود.
آیا محدودیتی وجود دارد که باید از آن آگاه بود؟
فایل های تا 50 مگابایت پشتیبانی می شوند. پردازش فایل های بسیار بزرگ یا پیچیده ممکن است بیشتر طول بکشد. تمام تبدیل ها در مرورگر شما انجام می شود، بنابراین سرعت پردازش به دستگاه شما بستگی دارد.
آیا تصاویر من در هنگام تبدیل خصوصی نگه داشته می شوند؟
بله. فایل های SVG شما به طور کامل در مرورگر شما با استفاده از Canvas API و جاوا اسکریپت پردازش می شوند. هیچ چیزی در هیچ سروری آپلود نمی شود - فایل مستقیماً از دستگاه شما به مبدل می رود و به دستگاه شما برمی گردد.
آیا متن به صورت متن ارائه می شود یا به صورت مسیر؟
متن به صورت پیکسل در PNG خروجی شطرنجی می شود. خروجی دیگر قابل جستجو یا انتخاب نیست. اگر SVG شما از فونت‌هایی استفاده می‌کند که در مرورگر موجود نیستند، ممکن است متن با فونت بازگشتی ارائه شود. متن را به مسیرهایی در SVG قبل از رندر برای ظاهر تضمین شده تبدیل کنید.
آیا SVG من روی سرور آپلود می شود؟
نه. تجزیه و رندر SVG در مرورگر شما اتفاق می افتد. رمزگذاری PNG در مرورگر شما اتفاق می افتد. فایل از دستگاه شما خارج نمی شود.
چرا PNG تبدیل شده من خالی است؟
علل رایج: SVG به تصاویر خارجی اشاره می کند که به دلیل CORS بارگیری نشدند. SVG از ویژگی هایی استفاده می کند که توسط مسیر رندر عنصر Image پشتیبانی نمی شوند (foreignObject، فیلترهای خاص). SVG دارای ViewBox صفر بعدی است. SVG را مستقیماً در مرورگر باز کنید تا قبل از تبدیل تأیید کنید که رندر می شود.
آیا می توانم SVG را در یک اسکریپت به PNG تبدیل کنم؟
بله - برای کارهای دسته‌ای، یک راه‌اندازی Node.js با استفاده از تیز یا عروسکی SVG را با وفاداری مشابه به مرورگر به PNG ارائه می‌کند. این ابزار برای تبدیل یکباره در مرورگر بدون نصب چیزی است.