محول SVG إلى مكون React JSX / TSX وVue
حوّل أيقونات SVG إلى مكونات React TSX أو React JSX أو Vue 3 نظيفة بنقرة واحدة مع تحويل الخصائص تلقائيًا ودعم currentColor.
أو الصق / عدّل كود SVG مباشرةً أدناه
import type { SVGProps } from "react"
export function SvgIcon(props: SVGProps<SVGSVGElement>) {
return (
<svg xmlns="http://www.w3.org/2000/svg" width="128" height="64" viewBox="0 0 128 64" {...props}>
<rect x="16.12" y="12.57" width="96" height="40" rx="8" fill="currentColor" stroke="currentColor" strokeWidth="2"/>
<circle cx="44.89" cy="32.44" r="10.25" fill="currentColor"/>
</svg>
)
}
export default SvgIcon
المواصفات التقنية والخصوصية المحلية
- طريقة المعالجة
- معالجة محلية 100% داخل المتصفح (دون رفع ملفات)
- المحرك الأساسي
- SVGR Attribute AST Mapper (React TSX / JSX / Vue 3)
- الترخيص والتكلفة
- مجاني بالكامل، بدون علامة مائية أو تسجيل
الأسئلة الشائعة
حوّل أيقونات SVG إلى مكونات React TSX أو React JSX أو Vue 3 نظيفة بنقرة واحدة مع تحويل الخصائص تلقائيًا ودعم currentColor. (معالجة محلية 100% داخل المتصفح (دون رفع ملفات))
مجاني بالكامل، بدون علامة مائية أو تسجيل · SVGR Attribute AST Mapper (React TSX / JSX / Vue 3)