Using SVG in Cocos Creator 3.8.6 (2D Project) – Any Plugins or Workarounds?

Cocos Creator
1

Hi everyone, I’m currently working on a 2D project using Cocos Creator version 3.8.6, and I understand that SVG files are not supported natively.

I’m wondering if anyone has found a third-party plugin or a reliable custom solution to load and render SVG assets within a Cocos 2D project. Ideally, I’d like to preserve vector scalability and avoid rasterizing the assets beforehand.

Some things I’d love insight on:

  • Existing plugins/tools compatible with Cocos Creator 3.8.x
  • Potential workflows using SVG-to-mesh or SVG-to-canvas rendering
  • Performance considerations for real-time use

If you’ve attempted this or know any directions to explore, I’d really appreciate your advice. Thanks in advance!

2

I can offer a solution for you .

  1. import your svg file to rive editor.
  2. export rive animation files. like xxx.riv
  3. load riv file and play it in cocoscreater use a extension. Rive Animation Loader
  4. I am the author of this extension . Now the extension only support to export and run on web or web-like platforms. if you want to play riv files on native Android or iOS,you need to deploy the official c++ runtime of rive by yourself.
  5. The implementation principle of the plugin is to render as canvas, like your words “SVG-to-canvas rendering” .
  6. The official web implementation is wasm. native can use c++. My own small-scale test did not encounter any obvious performance issues.

riv file in cocoscreater and export to web preview