نمایشگر SVG
کد خام SVG را بچسبانید و فوراً نتیجه رندرشده را پیشنمایش کنید.
پیشنمایش، اسکریپتها و ارجاعهای خارجی را غیرفعال میکند و در عین حال امکان بررسی viewBox و جزئیات اندازه را میدهد.
پیشنمایش SVG: کد خام را بچسبانید و فوراً نتیجه را بررسی کنید
بررسی viewBox و اندازه: شفافیت و محتوای بالقوه ناامن را بازبینی کنید
نحوه استفاده
- کد SVG را بچسبانید یا یک فایل `.svg` بارگذاری کنید.
- برای بررسی رندر، پسزمینه و سطح بزرگنمایی را عوض کنید.
- viewBox، جزئیات اندازه و هشدارها را بررسی کنید و در صورت نیاز SVG را ذخیره کنید.
نمونه
SVG آیکون ساده
ورودی
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 120 120"><circle cx="60" cy="60" r="52" fill="#0ea5e9"/><path d="M36 62l16 16 32-40" fill="none" stroke="#fff" stroke-width="10" stroke-linecap="round" stroke-linejoin="round"/></svg>
خروجی
یک آیکون دایرهای آبی رندر میشود و viewBox در پنل اطلاعات بهصورت `0 0 120 120` نمایش داده میشود.
سوالات متداول
آیا SVG من جایی بارگذاری میشود؟
خیر. SVGهای چسباندهشده و فایلهای بارگذاریشده در مرورگر شما میمانند و به سرور فرستاده نمیشوند.
برای SVGهایی که script یا foreignObject دارند چه اتفاقی میافتد؟
پیشنمایش امن پیش از رندر این عناصر را حذف میکند و در پنل اطلاعات هشدار نشان میدهد.
آیا SVGهایی که تصویر یا فونت خارجی دارند دقیقاً همانطور رندر میشوند؟
نه همیشه. ارجاعهای خارجی غیرفعال هستند، بنابراین ظاهر ممکن است با محیط اصلی متفاوت باشد. این ابزار، بررسی امنِ محلی را در اولویت میگذارد.
چرا SVG من رندر نمیشود؟
دلایل رایج، XML نامعتبر، مقدارهای ویژگی نادرست یا ریشهای است که `svg` نیست. پیام خطای نمایشدادهشده توسط ابزار را بررسی کنید.
چرا باید پسزمینه را عوض کنم؟
ناحیههای شفاف و آیکونهای روشن بسته به پسزمینه میتوانند بسیار متفاوت دیده شوند، بنابراین ابزار به شما اجازه میدهد پسزمینه شطرنجی، سفید و تیره را سریع امتحان کنید.
نکتهها
- برای ایمنی، ارجاعهای URL خارجی و عناصر خطرناک پیش از رندر غیرفعال میشوند.
- SVGهایی که به فونت یا تصویر خارجی وابستهاند ممکن است مانند محیط اصلی خود دیده نشوند.
- فایلهای SVG بسیار بزرگ بهطور خودکار از حالت پیشنمایش زنده خارج میشوند و از شما میخواهند رندر را بهصورت دستی انجام دهید.