PNG sang SVG cho Canva và Figma
Logo của bạn bị mờ khi phóng to trong Canva, hoặc bạn cần các lớp vectơ thực sự trong Figma. Chuyển đổi PNG sang SVG màu phẳng tuân theo quy tắc tải lên của Canva.
Thả PNG của bạn vào đây
Kéo và thả hình ảnh, hoặc nhấp để chọn một tệp.
Chọn hình ảnhPNG, JPG, WEBP, BMP, GIF
Trình chuyển đổi mở với các cài đặt được khuyến nghị bên dưới. Mở bộ chuyển đổi mà không có tệp
Lưới gốc
vectơ SVG
Cách chuyển đổi PNG sang SVG cho Canva hoặc Figma
- Bắt đầu từ file PNG sạch nhất. Sử dụng phiên bản lớn nhất bạn có, được cắt theo tác phẩm nghệ thuật. Màu phẳng và cạnh sắc nét sẽ được sao chép tốt.
- Upload and convert. Kéo thả PNG vào đây; JPG, WEBP, BMP và GIF cũng được, tối đa 15 MB. Bộ cài đặt trước sẽ được áp dụng, và xem trước hoàn toàn miễn phí mà không cần tài khoản.
- Check the preview. Tìm các đốm lạ, chi tiết bị thiếu và các sắc thái cùng màu dư thừa, sau đó điều chỉnh Chất lượng nếu cần.
- Download the SVG. Tải xuống với một tín dụng. Đối với Canva, hãy kiểm tra xem dung lượng tệp có dưới 3 MB không; nếu không, hãy giảm chất lượng và chuyển đổi lại.
- Import it. Trong Canva, hãy thêm nó qua mục tải lên của bạn. Trong Figma, hãy kéo SVG vào canvas.
Cài đặt được khuyến nghị
Lý do PNG bị mờ trong Canva và Figma
PNG là một lưới pixel. Phóng to nó để làm banner trong Canva hoặc khung lớn trong Figma và các cạnh sẽ bị mờ và răng cưa. Chuyển đổi PNG sang SVG cho Canva và Figma thay thế các pixel bằng các hình dạng vector, giúp đồ họa luôn sắc nét ở mọi kích thước.
Điều này cũng hữu ích nếu bạn tạo logo trên gói miễn phí của Canva. Việc tải lên SVG lên Canva không giới hạn ở gói Pro, nhưng việc tải xuống thiết kế của bạn dưới dạng SVG là tính năng của gói trả phí. Thay vào đó, hãy tải xuống dưới dạng PNG và thực hiện bước chuyển đổi PNG sang SVG của Canva tại đây.
Quy tắc của Canva để tải lên SVG
Trung tâm trợ giúp của Canva liệt kê một số yêu cầu đối với việc tải lên SVG. Dưới đây là cách mỗi yêu cầu đó ánh xạ đến SVGR.
| Canva asks for | How to get there in SVGR |
|---|---|
| A file under 3 MB | Chuyển chất lượng sang tệp nhỏ hơn, hoặc cắt nguồn chỉ còn phần hình ảnh |
| SVG 1.1 | Không phải là cài đặt trong SVGR; nếu Canva từ chối tệp, hãy kiểm tra các hàng kích thước và gradient trước |
| Mở rộng tất cả các nét vẽ, đường dẫn và hộp văn bản | Đầu ra được tạo từ các hình dạng đã điền không có nét viền; hãy giữ tùy chọn Nhận dạng văn bản tắt để không thêm văn bản sống |
| Tránh sử dụng kết cấu và màu chuyển sắc | Với loại Thiết kế và Nhận dạng văn bản tắt, SVGR sẽ phân tích các màu phẳng; hãy bắt đầu từ nghệ thuật phẳng, vì gradient trong nguồn sẽ xuất hiện dưới dạng các dải màu |
Những gì bạn sẽ thấy khi nhập SVG vào Figma
Figma nhập SVG dưới dạng các lớp vector, cho phép bạn chọn, đổi màu và thay đổi kích thước các hình dạng trực tiếp. Đó chính là mục đích của việc chuyển đổi PNG sang SVG trong Figma: bạn nhận được các hình dạng có thể chỉnh sửa thay vì một hình ảnh phẳng.
SVGR xếp chồng các hình dạng thay vì cắt lỗ. Phần rỗng của chữ O, hoặc khoảng trống bên trong một vòng tròn, là một hình có màu nền đặt trên một hình đặc, vì vậy trong Figma bạn sẽ thấy các lớp chồng lên nhau. Điều này trông đúng trên nền cùng màu nhưng sẽ hiển thị rõ trên bất kỳ màu nền nào khác.
Để tạo một lỗ thực sự, hãy chọn hình dạng ở trên cùng cùng với hình dạng ở bên dưới và áp dụng Subtract (Trừ) từ các phép toán boolean của Figma.
Văn bản: các hình dạng đã theo dõi hay văn bản sống?
Với tính năng Nhận dạng văn bản tắt, chữ được vẽ dưới dạng các hình khối. Nó trông giống hệt bản gốc và hoạt động trên cả hai ứng dụng, nhưng bạn không thể gõ lại nó.
Khi bật tính năng này, văn bản được phát hiện sẽ trở thành văn bản SVG sống, và SVGR cũng thực hiện tinh chỉnh màu sắc, có thể thêm các lớp phủ gradient. Canva yêu cầu văn bản phải được mở rộng, vì vậy hãy tắt tính năng này tại đó. Figma nhập văn bản SVG dưới dạng văn bản sống, với các khoảng trống: độ mờ của văn bản bị bỏ qua, kích thước phông chữ dựa trên em được đọc dưới dạng pixel, và khoảng cách chữ (letter-spacing) trên các đoạn văn bản riêng lẻ bị bỏ qua.
Đối với logo, hãy tắt Nhận dạng văn bản. Nếu bạn cần các tiêu đề có thể chỉnh sửa, hãy gõ lại chúng trong Figma bằng phông chữ phù hợp.
Giới hạn của sự hiểu biết
- Chuyển PNG sang SVG cho Canva và Figma hoạt động tốt cho đồ họa phẳng, không phải ảnh chụp. Một bức ảnh được vector hóa sẽ trở thành một tệp lớn, phức tạp; đối với Canva, hãy tải lên chính bức ảnh đó dưới dạng JPG hoặc PNG.
- Các file PNG bo mềm có thể trả về các màu gần giống nhau, chẳng hạn như nhiều sắc độ đen gần như giống hệt nhau. Hãy đổi màu chúng thành một màu duy nhất trong Figma hoặc trình chỉnh sửa khác nếu bạn muốn một bảng màu sạch sẽ.
- Cách Canva cho phép bạn đổi màu SVG đã tải lên phụ thuộc vào tệp, và chúng tôi chưa kiểm tra trên mọi thiết kế. Hãy tải lên một tệp thử nghiệm trước khi xây dựng mẫu xung quanh nó.
- Các hình dạng xếp chồng lên nhau cũng quan trọng trong Canva. Với nền trong suốt, phần bên trong của chữ "O" sẽ giữ nguyên màu nền gốc và hiện ra như một đốm màu trên bất kỳ màu nào khác. Hãy cắt các lỗ hổng này trong Figma, hoặc dùng Path > Difference (Chênh lệch) trong Inkscape, trước khi tải lên.
- Nền trong suốt loại bỏ hình dạng được vẽ bằng màu có ở các góc ảnh, đây chính là điều mọi người gọi là nền. Nếu tác phẩm nghệ thuật của bạn tràn vào cả bốn góc, hoặc các góc có màu sắc khác nhau, sẽ không có gì bị loại bỏ và nền vẫn giữ nguyên — hãy tạo cho tác phẩm một lề đơn giản, đồng đều rồi chuyển đổi lại. Các khu vực hoàn toàn bị bao quanh bởi tác phẩm nghệ thuật sẽ không bao giờ bị loại bỏ, và một file PNG đã có kênh trong suốt sẽ được giữ nguyên.
- Các đường cong được vẽ bằng nhiều đoạn thẳng ngắn. Được vẽ từ một hình ảnh nhỏ, chúng có thể trông hơi góc cạnh khi phóng to, vì vậy hãy bắt đầu từ bản sao lớn nhất bạn có.
Câu hỏi thường gặp
Tôi có thể tải lên SVG lên Canva trên gói miễn phí không?
Đúng vậy. Việc tải lên SVG không giới hạn ở gói Pro; tính năng trả phí là tải xuống thiết kế của bạn dưới dạng SVG. Hãy giữ dung lượng tệp dưới 3 MB.
Tại sao SVG của tôi không hiển thị đúng trong Canva?
Canva yêu cầu các tệp SVG 1.1 dưới 3 MB, với các nét vẽ, đường dẫn và văn bản đã được mở rộng, không có kết cấu hoặc gradient. Hãy kiểm tra văn bản động và các lớp phủ gradient trước: chuyển đổi lại với tùy chọn Nhận dạng văn bản tắt, từ nguồn màu phẳng.
Tại sao có các hình dạng chồng lên nhau trong Figma?
SVGR xếp chồng các hình dạng: lỗ hổng trong một chữ cái hoặc vòng tròn là một hình dạng có màu nền nằm trên một hình dạng đặc. Chọn cả hai và sử dụng Subtract (Trừ) để biến nó thành một lỗ hổng thực sự.
Can I edit the text?
Khi tắt Nhận dạng văn bản, văn bản sẽ ở dạng hình khối: bạn có thể đổi màu và định dạng lại nhưng không thể chỉnh sửa nội dung. Khi bật, Figma nhập văn bản dưới dạng văn bản động, mặc dù nó bỏ qua độ mờ của văn bản và một số khoảng cách chữ. Canva yêu cầu văn bản đã mở rộng, vì vậy hãy tắt tính năng này tại đó.
Is the file too big?
Giới hạn tải lên SVG của Canva là 3 MB. Di chuyển Chất lượng sang "Tệp nhỏ hơn", cắt theo tác phẩm nghệ thuật hoặc giảm số màu trong nguồn, sau đó chuyển đổi lại.
Tôi có thể vector hóa hình ảnh cho Canva nếu đó là JPG hay ảnh chụp màn hình không?
Đúng vậy. SVGR chấp nhận PNG, JPG, WEBP, BMP và GIF dung lượng tối đa 15 MB. Chuyển đổi và xem trước miễn phí, không cần tài khoản; tải xuống tốn một tín dụng.
Các trường hợp sử dụng liên quan
Sẵn sàng chuyển đổi?
Chuyển đổi và xem trước là miễn phí, không cần tài khoản. Tải xuống SVG hoặc PDF sử dụng một tín dụng.