Tracepen cho Figma: Plugin Trace Ảnh Sang Vector Miễn Phí

Cài Tracepen trên Figma Community →

Tracepen là plugin chuyển ảnh sang vector cho Figma: nó biến một ảnh raster — file bạn mở từ máy, hoặc layer đang chọn trên canvas — thành path vector chỉnh sửa được, mỗi màu một path, không phải rời khỏi Figma. Bộ trace là tất định: không AI, không ngẫu nhiên, cùng ảnh với cùng thiết lập luôn ra cùng một bộ đường cong, và việc chuyển đổi diễn ra trên máy bạn. Miễn phí với đủ mọi tính năng và vài lượt xuất mỗi ngày với tài khoản 3dshouse miễn phí; số lượt đó dùng chung với bản web, extension SketchUp và add-on Blender.

• Node vector thật, không phải ảnh dán lên: kết quả là một frame chứa các path vector, chỉnh được bằng công cụ node.
• Use selection: vector hóa thứ đã có sẵn trên canvas — việc mà không định dạng xuất file nào làm thay bạn được.
• Mỗi màu một path, lỗ được khoét ra từ chính path đó, và các đoạn cong Bezier bắt được bằng công cụ node chứ không phải hàng nghìn đoạn thẳng li ti.
• Bốn thông số đáng chỉnh: số màu, lọc nhiễu, vùng nhỏ nhất được giữ, độ bo góc.
• Trace không tính lượt — trace lại bao nhiêu lần tùy ý; chỉ khi đặt kết quả lên canvas mới tính là một lượt xuất.
• Phát hành miễn phí trên Figma Community theo Community Free Resource License.

Plugin làm gì trong Figma

Panel mở cố định 480 x 720 px và mang đúng giao diện của bản web: chọn file, cắt ảnh, bốn thanh trượt, danh sách layer màu và một nút. Khi bạn bấm Add to design, plugin đưa dữ liệu vector đã trace cho bộ nhập SVG của chính Figma, nên bản trace hiện ra là một frame gồm các path vector chứ không phải bitmap dán lên bảng. Mỗi path là hình học sống: boolean, bo góc, đổi màu, đưa vào component đều được.

Plugin chạy trong file Figma Design. Manifest chỉ cho phép hai địa chỉ mạng: 3dshouse.com để đăng nhập và kiểm lượt miễn phí, và tracepen.3dshouse.com để tải ảnh mẫu ở lần dùng đầu. Ảnh của bạn được trace ngay trong panel của plugin, và không request nào mang nó theo.

Vì sao “Use selection” là lý do plugin tồn tại

Tôi làm bản web trước, và SVG vốn đã nhập vào Figma gọn gàng. Vậy một plugin chỉ đáng có khi làm được điều mà vòng xuất-nhập file không làm được: đọc canvas. Bấm Use selection, plugin nhờ Figma xuất node đầu tiên đang chọn thành PNG — node nào cũng được: ảnh chụp, frame, group, bản phác đã flatten — rồi đưa thẳng vào bộ trace như thể bạn mở nó từ ổ đĩa. Không chọn gì, hoặc chọn thứ Figma không cho xuất, panel sẽ báo thay vì lặng lẽ thất bại. Trong mọi nơi Tracepen chạy, Figma là nơi duy nhất trao được vùng chọn, nên nút này không có ở bản nào khác.

Cách trace ảnh trong Figma

1. Trong file Figma Design, chạy Plugins → Tracepen.
2. Đăng nhập. Plugin mở một tab trình duyệt để đăng nhập 3dshouse và chờ — tối đa mười phút — rồi tự nhận phiên đăng nhập. Cần một tài khoản miễn phí trước khi dùng được công cụ.
3. Mở một file ảnh (hoặc bấm một ảnh mẫu), hoặc chọn một layer trên canvas rồi bấm Use selection.
4. Khi mở, ảnh được phân tích: Color number được đặt sẵn theo bảng màu thật sự có trong ảnh, và chế độ Logo hay Photo được chọn cho khớp.
5. Cắt ảnh nếu chỉ cần một phần: bấm Crop, kéo một khung trên canvas, và từ đó mọi bước chỉ làm việc trên vùng đó — nhẹ hơn nhiều so với trace cả ảnh chụp màn hình để lấy ra một icon. Cancel Crop để bỏ cắt.
6. Tinh chỉnh. Noise filter dọn các đốm rỗ dọc mép (0 là tắt). Merge min area bỏ các vùng màu nhỏ hơn số pixel đó. Corner smooth đi từ góc nhọn đến bo tròn hẳn. Line thickness và Line color thêm nét viền.
7. Bấm Convert. Nút đếm từng bước khi chạy và kết thúc bằng số màu đã tạo ra.
8. Xem danh sách Color Layers, đổi màu một ô hoặc bỏ tick layer không cần — layer bỏ tick sẽ không có trong kết quả.
9. Bấm Add to design.

Thứ gì xuất hiện trên canvas

Mỗi màu đang hiện thành đúng một path mang mọi đường viền ngoài và có lỗ được khoét ra từ chính hình đó, nên chữ O vẫn là chữ O chứ không phải hai hình chồng lên nhau. Frame mang tên file gốc, nằm giữa khung nhìn hiện tại và được chọn sẵn, sẵn sàng để kéo hay group. Layer xếp theo diện tích lớn trước, rồi theo độ gần màu, nên các dòng cạnh nhau trong danh sách trông giống nhau.

Hai chi tiết đáng biết, vì chúng chặn những lời phàn nàn quen thuộc với bộ trace. Hai màu phẳng cạnh nhau khít vào nhau, không còn đường khe mảnh mà bộ trace thường để lại giữa chúng, và bạn không phải chỉnh gì cho việc đó. Và tăng Merge min area dọn sạch các đốm mà không bao giờ làm mất hẳn một màu, nên viền đen 1 px vẫn còn thay vì âm thầm biến mất. Đặt Color number bằng 1 thì bạn có hình bóng phẳng của chủ thể — đường ngắn nhất để có một mask hay một đường cắt sticker.

Định dạng: Figma nhận gì, bản web nhận gì

Trong công cụ thiết kế, kết quả là node vector, nên ở đây không có menu file — Add to design thay cho nó. Mở đúng bức ảnh đó trên bản web Tracepen thì cùng một bản trace lưu được thành SVG, PNG, PDF hoặc một trong ba kiểu DXF. Cả ba kiểu DXF đều đặt mỗi màu lên một layer DXF riêng, mang đúng màu đó dưới dạng true color — đây là điểm quan trọng với máy móc: máy cắt hay máy laser có thể nhận thiết lập riêng cho từng màu thay vì một thiết lập cho cả file.

• DXF Lines — mỗi vùng là một đường viền kín: cắt trên Cricut, Silhouette, LightBurn chế độ cut, hay máy CNC.
• DXF Hatch — vùng tô đặc: khắc fill/scan trên LightBurn, và nhập vào AutoCAD trông đúng.
• DXF Faces — mặt đã chia tam giác, nên file vào SketchUp thành face đặc thật chứ không phải mớ cạnh rời. (Extension SketchUp thì bỏ qua luôn bước file và dựng thẳng những face đó trong model.)

Tracepen, Vectorize của Figma và các plugin trace khác

Từ tháng 2/2026 Figma có Vectorize riêng, một tính năng AI cho Full seat trên gói trả phí có bật AI. Tracepen dành cho tất cả những người còn lại, và cho ai muốn cùng một ảnh luôn ra cùng một bộ path, mỗi màu thành một layer. Muốn xem Vectorize và mười một plugin trace đặt cạnh nhau (hỗ trợ màu, ảnh có rời khỏi Figma không, giá), đọc so sánh các plugin chuyển ảnh sang vector trong Figma.

Điểm khác của bộ trace Tracepen nằm ở cách xử lý màu. Nó được làm để xử lý ảnh màu thuộc bất kỳ loại nào, và chính xác trên ảnh graphic màu phẳng như logo hay ảnh gồm các mảng màu phẳng. Đó là một việc khác với tool trace một màu (ví dụ các plugin dùng Potrace), vốn chỉ trace một màu, và khác với tool vector hóa bằng AI, vốn vẽ lại bức ảnh nên kết quả không chính xác so với bản gốc. Kết quả của Tracepen là tất định, nên bạn có thể đặt bản trace chồng lên ảnh gốc để kiểm tra.

Những điều cần biết

• Ảnh xuất từ vùng chọn có giới hạn. PNG mà Figma trao cho plugin được co để cạnh dài là 1500 px. Một thumbnail nhỏ phóng to trên canvas vẫn trace như một thumbnail nhỏ — nếu có file gốc, hãy mở file gốc.
• Ảnh lớn thì phải chờ. Panel bận suốt lượt chuyển đổi: Figma vẫn mượt, còn panel này thì không. Logo, icon hay minh hoạ màu phẳng là cỡ mà công cụ được làm ra cho; ảnh chụp đầy đủ thì mất thời gian.
• Add to design là thao tác tính lượt, giống hệt nút tải file ở các bản khác. Việc kiểm lượt chạy trước khi tạo node, nên lần thêm bị từ chối sẽ không đặt gì lên canvas.
• Không có menu Download. Trong công cụ thiết kế, panel thay nó bằng Add to design. Cần SVG, PNG, PDF hay ba kiểu DXF thì mở cùng ảnh trên bản web.
• Khử răng cưa làm tăng số màu. Một ảnh chụp màn hình “hai màu” mang thêm các sắc độ trung gian dọc theo mọi cạnh. Hãy giảm số màu hoặc tăng diện tích vùng tối thiểu.
• Đăng nhập theo từng nơi. Iframe của plugin không có bộ nhớ trình duyệt, nên phiên đăng nhập được giữ trong bộ nhớ plugin của Figma — đăng nhập trên bản web không làm bạn đăng nhập ở đây.

Gói miễn phí

Gói miễn phí không phải bản demo bị cắt: đủ tính năng, đủ màu, mọi định dạng, mọi nền tảng. Giới hạn duy nhất là vài lượt xuất mỗi ngày cho mỗi tài khoản, và số lượt đó dùng chung giữa bản web, SketchUp, Blender và plugin này, vì tất cả cùng đếm trên một tài khoản. Trace và trace lại thì miễn phí, không giới hạn, nên bạn thử thiết lập bao lâu cũng được và chỉ tiêu một lượt khi đã ưng. Add-on Blender là ngoại lệ và đáng biết: ở đó chính lượt trace bị tính, vì không có gì được xuất ra — hình học rơi thẳng vào scene của bạn.

So với các bộ vector hóa trên desktop mà nhiều người dùng thay thế — Image Trace của Illustrator, PowerTRACE của CorelDRAW, Vector Magic — thì khác nhau ra sao, đọc bài cùng một ảnh qua bốn công cụ.

Các bản khác

• Tracepen bản web — đủ công cụ trên trình duyệt, với mọi định dạng xuất.
• Tracepen cho SketchUp — dựng face và group gốc ngay trong model.
• Tracepen cho Blender — mesh hoặc đường cong Bezier chỉnh được, mỗi màu một object.

Cài đặt

Cài Tracepen trên Figma Community →

1. Mở trang Community và mở plugin trong Figma từ đó.
2. Trong file Figma Design, chạy Plugins → Tracepen.
3. Đăng nhập bằng tài khoản 3dshouse miễn phí trong tab trình duyệt vừa mở, rồi quay lại panel.

Yêu cầu

• Tài khoản Figma và một file Figma Design.
• Tài khoản 3dshouse miễn phí để đăng nhập và đếm lượt xuất mỗi ngày.
• Figma bản desktop hoặc trình duyệt; plugin chạy bên trong Figma, không phải cài gì thêm trên máy.