{"id":25003386,"url":"https://github.com/thorvg/thorvg","last_synced_at":"2026-09-30T18:12:00.561Z","repository":{"id":38026794,"uuid":"289829423","full_name":"thorvg/thorvg","owner":"thorvg","description":"A production-ready C++ vector graphics engine supporting SVG and Lottie formats, featuring advanced rendering backends such as WebGPU for high-performance graphics.","archived":false,"fork":false,"pushed_at":"2026-09-29T07:16:14.000Z","size":412552,"stargazers_count":1844,"open_issues_count":200,"forks_count":255,"subscribers_count":37,"default_branch":"main","last_synced_at":"2026-09-29T07:34:15.093Z","etag":null,"topics":["2d-graphics","animation","embedded","embedded-software","graphics-library","lottie","lottie-animation","opengl","otf","rendering-engine","svg","ttf","vector-graphics","webassembly","webgl","webgpu"],"latest_commit_sha":null,"homepage":"https://www.thorvg.org","language":"C++","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/thorvg.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"CONTRIBUTING.md","funding":".github/FUNDING.yml","license":"LICENSE","code_of_conduct":"CODE_OF_CONDUCT.md","threat_model":null,"audit":null,"citation":null,"codeowners":"CODEOWNERS","security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null,"notice":null,"maintainers":null,"copyright":null,"agents":null,"claude":null,"gemini":null,"cursor":null,"copilot":null,"dco":null,"cla":null,"disclosure":null},"funding":{"github":"thorvg","open_collective":"thorvg"}},"created_at":"2020-08-24T04:40:42.000Z","updated_at":"2026-09-29T05:44:11.000Z","dependencies_parsed_at":"2026-09-29T06:14:24.314Z","dependency_job_id":null,"html_url":"https://github.com/thorvg/thorvg","commit_stats":{"total_commits":3275,"total_committers":70,"mean_commits":"46.785714285714285","dds":0.7053435114503817,"last_synced_commit":"c75ec0f33338e728d87f6c9ecc9d38cf6b265d2b"},"previous_names":["samsung/thorvg"],"tags_count":131,"template":false,"template_full_name":null,"purl":"pkg:github/thorvg/thorvg","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/thorvg%2Fthorvg","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/thorvg%2Fthorvg/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/thorvg%2Fthorvg/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/thorvg%2Fthorvg/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/thorvg","download_url":"https://codeload.github.com/thorvg/thorvg/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/thorvg%2Fthorvg/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":342085742,"owners_count":37837584,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-08-22T15:14:58.755Z","status":"online","status_checked_at":"2026-09-29T02:00:06.972Z","response_time":187,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["2d-graphics","animation","embedded","embedded-software","graphics-library","lottie","lottie-animation","opengl","otf","rendering-engine","svg","ttf","vector-graphics","webassembly","webgl","webgpu"],"created_at":"2025-02-04T22:20:11.818Z","updated_at":"2026-09-30T18:12:00.549Z","avatar_url":"https://github.com/thorvg.png","language":"C++","funding_links":["https://github.com/sponsors/thorvg","https://opencollective.com/thorvg"],"categories":["Graphics","Libraries"],"sub_categories":["Creation Tools"],"readme":"[![LFX Health Score](https://insights.linuxfoundation.org/api/badge/health-score?project=thorvg)](https://insights.linuxfoundation.org/project/thorvg)\n[![CodeFactor](https://www.codefactor.io/repository/github/thorvg/thorvg/badge)](https://www.codefactor.io/repository/github/thorvg/thorvg)\n![BinarySize](https://img.shields.io/badge/Size-\u003e170kb-black)\n[![License](https://img.shields.io/badge/licence-MIT-green.svg?style=flat)](LICENSE)\n[![Wikipedia](https://img.shields.io/badge/Wikipedia-000000?style=flat\u0026logo=wikipedia\u0026logoColor=white)](https://en.wikipedia.org/wiki/Thor_Vector_Graphics)\n[![DeepWiki](https://deepwiki.com/badge.svg)](https://deepwiki.com/thorvg/thorvg)\n[![Discord](https://img.shields.io/badge/Community-5865f2?style=flat\u0026logo=discord\u0026logoColor=white)](https://discord.gg/n25xj6J6HM)\n[![OpenCollective](https://img.shields.io/badge/OpenCollective-84B5FC?style=flat\u0026logo=opencollective\u0026logoColor=white)](https://opencollective.com/thorvg)\n\u003cbr\u003e\n[![Build Ubuntu](https://github.com/thorvg/thorvg/actions/workflows/build_ubuntu.yml/badge.svg?branch=main\u0026event=push)](https://github.com/thorvg/thorvg/actions/workflows/build_ubuntu.yml)\n[![Build Windows](https://github.com/thorvg/thorvg/actions/workflows/build_windows.yml/badge.svg?branch=main\u0026event=push)](https://github.com/thorvg/thorvg/actions/workflows/build_windows.yml)\n[![Build macOS](https://github.com/thorvg/thorvg/actions/workflows/build_macos.yml/badge.svg?branch=main\u0026event=push)](https://github.com/thorvg/thorvg/actions/workflows/build_macos.yml)\n[![Build iOS](https://github.com/thorvg/thorvg/actions/workflows/build_ios.yml/badge.svg?branch=main\u0026event=push)](https://github.com/thorvg/thorvg/actions/workflows/build_ios.yml)\n[![Build Android](https://github.com/thorvg/thorvg/actions/workflows/build_android.yml/badge.svg?branch=main\u0026event=push)](https://github.com/thorvg/thorvg/actions/workflows/build_android.yml)\n\u003cbr\u003e\n[![Latest](https://img.shields.io/github/v/release/thorvg/thorvg?color=orange)](https://github.com/thorvg/thorvg/releases/latest)\n[![vcpkg](https://img.shields.io/vcpkg/v/thorvg?color=orange)](https://vcpkg.link/ports/thorvg)\n[![ArchLinux](https://img.shields.io/aur/version/thorvg?color=orange)](https://aur.archlinux.org/packages/thorvg)\n[![Conan](https://img.shields.io/conan/v/thorvg)](https://conan.io/center/recipes/thorvg)\n[![Fedora](https://img.shields.io/fedora/v/thorvg?color=orange)](https://src.fedoraproject.org/rpms/thorvg)\n[![MSYS2](https://img.shields.io/badge/msys2-Latest-orange)](https://packages.msys2.org/packages/mingw-w64-x86_64-thorvg?repo=mingw64)\n[![Nimble](https://img.shields.io/badge/nimble-Latest-FFE953?color=orange)](https://nimble.directory/pkg/thorvg)\n[![DUB](https://img.shields.io/dub/v/bindbc-thorvg?color=orange)](https://code.dlang.org/packages/bindbc-thorvg)\n[![Homebrew](https://img.shields.io/homebrew/v/thorvg?color=orange)](https://formulae.brew.sh/formula/thorvg)\n[![npm](https://img.shields.io/npm/v/@thorvg/webcanvas?color=orange)](https://www.npmjs.com/package/@thorvg/webcanvas)\n[![PyPI version](https://img.shields.io/pypi/v/thorvg-python?color=orange)](https://pypi.org/project/thorvg-python/)\n[![Crates.io](https://img.shields.io/crates/v/thorvg?color=orange)](https://crates.io/crates/thorvg)\n[![Debian](https://img.shields.io/debian/v/libthorvg-dev/forky?color=orange)](https://packages.debian.org/forky/libthorvg-dev)\n\u003cbr\u003e\n\n# ThorVG\n\n\u003cp align=\"center\"\u003e\n  \u003cimg width=\"550\" height=\"auto\" src=\"https://github.com/thorvg/thorvg.site/blob/main/readme/logo/animated_brand.svg\"\u003e\n\u003c/p\u003e\n\n**Thor Vector Graphics** is a **production-ready** vector graphics engine designed for creating **interactive apps** and **creative tools**. It combines **high performance** with **lightweight efficiency**, as Thor embodies a dual meaning—symbolizing both immense strength and lightning-fast agility. Embracing the philosophy of simplicity leads to reliability, the ThorVG project provides easy, **user-friendly interfaces** while maintaining a **compact footprint** and **minimal overhead**. \u003cbr /\u003e\n\u003cbr /\u003e\nThe following primitives are supported by ThorVG: \u003cbr /\u003e\n \n- **Lines \u0026 Shapes**: rectangles, circles, paths, and arbitrary vector geometry\n- **Filling**: solid colors and linear, radial, and conic gradients\n- **Stroking**: stroke width, joins, caps, dash patterns, and trimming\n- **Scene Management**: retained-mode scene graph and hierarchical transformations\n- **Composition**: W3C compositing and blending modes, masking, clipping, and nested scenes\n- **Text**: Unicode, scalable TTF/OTF fonts, and multi-line text layout\n- **Images**: SVG, PNG, JPEG, WebP, and raw bitmaps\n- **Effects**: blur, drop shadow, tint, tritone, color replacement, and fill effects\n- **Animations**: Lottie (JSON) playback and rendering\n\n\u003cp align=\"center\"\u003e\n  \u003cimg width=\"700\" height=\"auto\" src=\"https://github.com/thorvg/thorvg.site/blob/main/readme/example_primitives.png\"\u003e\n\u003c/p\u003e\n\n### Lightweight Design\n​ThorVG is designed for a wide range of programs, offering adaptability for integration and use in various applications and systems. It achieves this through a single binary with selectively buildable, modular components in a building block style. This ensures both optimal size and easy maintenance. \u003cbr /\u003e\n\n\u003cp align=\"center\"\u003e\n  \u003cimg width=\"750\" height=\"auto\" src=\"https://github.com/thorvg/thorvg.site/blob/main/readme/example_structure.png\"\u003e\n\u003c/p\u003e\n\nThe core library of ThorVG maintains a binary size of approximately **170KB**. This is significantly smaller compared to graphics engines designed primarily for desktop environments and offers the following advantages.\u003cbr /\u003e\n\n- **Memory Efficiency**: Thanks to its low runtime memory usage, ThorVG operates stably even on low-spec systems.\n- **Fast Boot**: The library loads and initializes quickly, improving the overall startup speed of applications.\n- **Low Size Deployment:** With its small code and resource footprint, ThorVG is well-suited for embedded systems, IoT devices, and network-constrained environments.\n\n### Broad Portability\nThorVG is based on the **C++** standard and provides consistent functionality across various platforms through an abstraction layer that minimizes dependence on specific operating systems or hardware. \u003cbr /\u003e\n\n- **Extensive Platform Support**: ThorVG supports web platforms, desktop operating systems such as Windows, macOS, and Linux, mobile platforms including Android and iOS, as well as embedded systems like Tizen and RTOS-based environments.\n- **Microcontroller Support**: ThorVG has been shown to run on microcontrollers like the ESP32, demonstrating its efficiency even within environments with highly limited memory and storage.\n- **Headless Rendering Support**: ThorVG can perform rendering without a display server, enabling use cases such as server-side graphics processing or offline rendering tools.\n\nIf your program includes the main renderer, you can seamlessly utilize ThorVG APIs by transitioning drawing contexts between the main renderer and ThorVG. Throughout these API calls, ThorVG effectively serializes drawing commands among volatile paint nodes. Subsequently, it undertakes synchronous or asynchronous rendering via its render-backend engines. Additionally, ThorVG is adept at handling vector images, including formats like SVG and Lottie, and it remains adaptable for accommodating additional popular formats as needed. In the rendering process, the library may generate intermediate frame buffers for scene compositing, though only when essential. The accompanying diagram provides a concise overview of how to effectively incorporate ThorVG within your system.\u003cbr /\u003e\n\n\u003cp align=\"center\"\u003e\n  \u003cimg width=\"900\" height=\"auto\" src=\"https://github.com/thorvg/thorvg.site/blob/main/readme/example_flow.png\"\u003e\n\u003c/p\u003e\n\n### CPU Rasterization\nThorVG is optimized for CPU-based rasterization, with a strong focus on vector rendering in environments where GPU resources are limited, unavailable, or intentionally avoided. In representative CPU benchmarks, ThorVG demonstrates **an average of ~2.9× faster performance** to a widely-used vector graphics engine across common vector rendering workloads. The advantage is particularly clear in geometry-heavy scenarios such as rectangles, strokes, rotations, and circle rendering.\n\n#### Performance Overview\n\u003cp align=\"center\"\u003e\n  \u003cimg width=\"1900\" height=\"auto\" alt=\"image\" src=\"https://github.com/thorvg/thorvg.site/blob/main/readme/example_performance.png\"\u003e\n\u003c/p\u003e\n\n#### Test Conditions\n- Tested with 5k semi-transparent primitives, including shapes, strokes, and images, using alpha blending.\n- Image filtering was performed using bilinear interpolation.\n- Test Platform: Apple M2 Pro (macOS 26)\n- Render size: 2560 × 1440 (2K) for each test case\n- Versions: ThorVG v1.1, Skia v148\n\n\u003cp align=\"center\"\u003e\n  \u003cimg width=\"800\" height=\"auto\" src=\"https://github.com/thorvg/thorvg.site/blob/main/readme/example_stress.png\"\u003e\n\u003c/p\u003e\n\n### Threading\nThorVG incorporates a threading mechanism designed to seamlessly retrieve upcoming scenes without unnecessary delays. It utilizes a finely-tuned task scheduler based on thread pools to handle a variety of tasks, including encoding, decoding, updating, and rendering. This architecture ensures efficient use of multi-core processing.\u003cbr /\u003e\n\u003cbr /\u003e\nThe task scheduler is carefully designed to abstract complexity, simplify integration, and enhance user convenience. Its use is optional, allowing users to adopt it based on their specific needs.\u003cbr /\u003e\n\n\u003cp align=\"center\"\u003e\n  \u003cimg width=\"900\" height=\"auto\" src=\"https://github.com/thorvg/thorvg.site/blob/main/readme/example_thread.png\"\u003e\n\u003c/p\u003e\n\n### Smart Rendering\nThorVG supports smart partial rendering, which enables more efficient rendering workflows by updating only the portions of a vector scene that have changed. By internally tracking modified regions, it minimizes unnecessary redraws and optimizes overall performance. This feature provides significant benefits in scenarios such as UI rendering, design tools, or applications where large parts of the scene remain static and only small elements update between frames. In such cases, avoiding full-scene rendering can greatly reduce computational workload and improve energy efficiency—making it particularly valuable on mobile and embedded systems.\u003cbr/\u003e\n\u003cbr/\u003e\nThe following figure illustrates the geometry changes and highlights the minimal redraw region (outlined in red) that needs to be updated. Only the modified area between the previous and current frames is selectively redrawn, significantly improving performance.\u003c/br\u003e\n\n\u003cp align=\"center\"\u003e\n  \u003cimg width=\"700\" height=\"auto\" src=\"https://github.com/thorvg/thorvg.site/blob/main/readme/example_partial.png\"\u003e\n\u003c/p\u003e\n\nPlease note that in highly dynamic content—such as fast-paced games or full-screen animations where nearly all objects change every frame—partial rendering provides little to no benefit and may even introduce minor overhead. In these scenarios, full-scene rendering is typically the better choice. For a practical showcase, visit [this page](https://hermet.github.io/partial-test/) demonstrating a performance comparison of partial rendering using ThorVG's software renderer.\u003cbr /\u003e\n\n### Render Backends\nToday, ThorVG provides its own implementation of multiple rendering backends, allowing you to choose the one that best suits your application and target platform.\n\u003cbr/\u003e\n\n- CPU/SIMD (Software)\n- OpenGL/ES\n- WebGL\n- WebGPU\n\nThorVG is particularly ahead of the curve in the web ecosystem. WebGPU introduces a next-generation graphics API comparable to Vulkan, providing low-overhead GPU access and modern graphics capabilities. This enables more aggressive optimization strategies while preserving feature parity with other ThorVG backends. All vector rendering features are fully supported on the WebGPU backend, ensuring a consistent rendering experience across platforms.\n\nBeyond feature completeness, the WebGPU backend also delivers substantial performance improvements over the OpenGL backend in many rendering workloads. Internal benchmarks show up an average of approximately **1.8× higher** rendering throughput, with the largest gains observed in stroke rendering, gradients, and image rendering. Even for general vector rendering, WebGPU consistently maintains higher performance while producing identical visual output.\n\n\u003cp align=\"center\"\u003e\n  \u003cimg width=\"1900\" height=\"auto\" src=\"https://github.com/thorvg/thorvg.site/blob/main/readme/example_gpu_performance.png\"\u003e\n\u003c/p\u003e\n\n\u003e [!NOTE]\n\u003e Benchmark results were obtained using [ThorVG's benchmark application](https://github.com/thorvg/thorvg.benchmark) on Apple M1. Actual performance may vary depending on the hardware, operating system, graphics driver, and rendering workload.\n\nFurthermore, by abstracting native graphics APIs such as Metal, Vulkan, and DirectX through WebGPU, ThorVG provides a single rendering interface that seamlessly scales across desktop, mobile, and web environments. This architecture allows applications to benefit from modern GPU capabilities without requiring platform-specific rendering code.\n\n\u003cp align=\"center\"\u003e\n  \u003cimg width=\"700\" height=\"auto\" src=\"https://github.com/thorvg/thorvg.site/blob/main/readme/example_webgpu.png\"\u003e\n\u003c/p\u003e\n\n### Supported Platforms\nThorVG is designed to be portable across a wide range of devices, including small IoT devices, embedded systems, mobile platforms, game consoles, desktop environments, and the web. It is actively under development, with continuous efforts to expand support for essential platforms as needed. Currently, the major supported platforms include:\u003cbr /\u003e\n\n\u003cp align=\"center\"\u003e\n  \u003cimg width=\"650\" height=\"auto\" src=\"https://github.com/thorvg/thorvg.site/blob/main/readme/example_platforms.png\"\u003e\n\u003c/p\u003e\n\n## Contents\n- [ThorVG](#thorvg)\n  - [Installation](#installation)\n    - [Build and Install](#build-and-install)\n    - [Build with Visual Studio](#build-with-visual-studio)\n    - [Build with Xcode](#build-with-xcode)\n  - [Quick Start](#quick-start)\n  - [SVG](#svg)\n  - [Lottie](#lottie)\n  - [In Practice](#in-practice)\n  - [ThorVG Demo](#thorvg-demo)\n  - [Examples](#examples)\n    - [C++ Examples](#c-examples)\n    - [Playground](#playground)\n  - [Tools](#tools)\n    - [ThorVG View](#thorvg-view)\n    - [VS Code LiveView](#vs-code-liveview)\n    - [CLI Tools](#cli-tools)\n  - [Related Projects](#related-projects)\n  - [API Bindings](#api-bindings)\n  - [Documentation](#documentation)\n  - [Dependencies](#dependencies)\n  - [Contributors](#contributors)\n  - [Partners](#partners)\n  - [Sponsors](#sponsors)\n  - [Communication](#communication)\n\n[](#contents)\n\u003cbr /\u003e\n## Installation\nThis section details the steps required to configure the environment for installing ThorVG.\u003cbr /\u003e\n\u003cbr /\u003e\n### Build and Install\nThorVG supports [meson](https://mesonbuild.com/) build system. Install [meson](http://mesonbuild.com/Getting-meson.html) and [ninja](https://ninja-build.org/) if you don't have them already.\n\nRun meson to configure ThorVG in the thorvg root folder.\n```\nmeson setup builddir\n```\nRun ninja to build \u0026 install ThorVG:\n```\nninja -C builddir install\n```\n\nRegardless of the installation, all build results (symbols, executable) are generated in the builddir folder in thorvg. Some results such as examples won't be installed, you can check More examples section to see how to change it. \u003cbr/\u003e\n​\u003cbr/\u003e\nNote that some systems might include ThorVG package as a default component. In that case, you can skip this manual installation.\u003c/br\u003e\n\n### Build with Visual Studio\nIf you want to create Visual Studio project files, use the command `--backend=vs`. The resulting solution file `thorvg.sln` will be located in the build folder.\n```\nmeson setup builddir --backend=vs\n```\n\n### Build with Xcode\nIf you want to create Xcode project files, use the command `--backend=xcode`. The resulting solution file `thorvg.xcodeproj` will be located in the build folder.\n```\nmeson setup builddir --backend=xcode\n```\n\n[Back to contents](#contents)\n\u003cbr /\u003e\n\u003cbr /\u003e\n## Quick Start\nThorVG renders vector shapes to a given canvas buffer. The following is a quick start to show you how to use the essential APIs.\n\nFirst, you should initialize the ThorVG engine:\n\n```cpp\ntvg::Initializer::init(4);   //4 threads\n```\n\nThen it would be best if you prepared an empty canvas for drawing on it:\n\n```cpp\nstatic uint32_t buffer[WIDTH * HEIGHT];                                   //canvas target buffer\n\nauto canvas = tvg::SwCanvas::gen();                                       //generate a canvas\ncanvas-\u003etarget(buffer, WIDTH, WIDTH, HEIGHT, tvg::ColorSpace::ARGB8888);  //buffer, stride, w, h, Colorspace\n```\n\nNext you can draw multiple shapes on the canvas:\n\n```cpp\nauto rect = tvg::Shape::gen();               //generate a shape\nrect-\u003eappendRect(50, 50, 200, 200, 20, 20);  //define it as a rounded rectangle (x, y, w, h, rx, ry)\nrect-\u003efill(100, 100, 100);                   //set its color (r, g, b)\ncanvas-\u003eadd(rect);                           //add the rectangle to the canvas\n\nauto circle = tvg::Shape::gen();             //generate a shape\ncircle-\u003eappendCircle(400, 400, 100, 100);    //define it as a circle (cx, cy, rx, ry)\n\nauto fill = tvg::RadialGradient::gen();      //generate a radial gradient\nfill-\u003eradial(400, 400, 150, 400, 400, 0);    //set the radial gradient geometry info (cx, cy, radius, fx, fy, fr)\n\ntvg::Fill::ColorStop colorStops[2];          //gradient colors\ncolorStops[0] = {0.0, 255, 255, 255, 255};   //1st color values (offset, r, g, b, a)\ncolorStops[1] = {1.0, 0, 0, 0, 255};         //2nd color values (offset, r, g, b, a)\nfill-\u003ecolorStops(colorStops, 2);             //set the gradient colors info\n\ncircle-\u003efill(fill);                          //set the circle fill\ncanvas-\u003eadd(circle);                         //add the circle to the canvas\n\n```\n\nThis code generates the following result:\n\n\u003cp align=\"center\"\u003e\n  \u003cimg width=\"416\" height=\"auto\" src=\"https://github.com/thorvg/thorvg.site/blob/main/readme/example_shapes.png\"\u003e\n\u003c/p\u003e\n\nYou can also draw you own shapes and use dashed stroking:\n\n```cpp\nauto path = tvg::Shape::gen();               //generate a path\npath-\u003emoveTo(199, 34);                       //set sequential path coordinates\npath-\u003elineTo(253, 143);\npath-\u003elineTo(374, 160);\npath-\u003elineTo(287, 244);\npath-\u003elineTo(307, 365);\npath-\u003elineTo(199, 309);\npath-\u003elineTo(97, 365);\npath-\u003elineTo(112, 245);\npath-\u003elineTo(26, 161);\npath-\u003elineTo(146, 143);\npath-\u003eclose();\n\npath-\u003efill(150, 150, 255);                   //path color\n\npath-\u003estrokeWidth(3);                        //stroke width\npath-\u003estrokeFill(0, 0, 255);                 //stroke color\npath-\u003estrokeJoin(tvg::StrokeJoin::Round);    //stroke join style\npath-\u003estrokeCap(tvg::StrokeCap::Round);      //stroke cap style\n\nfloat pattern[2] = {10, 10};                 //stroke dash pattern (line, gap)\npath-\u003estrokeDash(pattern, 2);                //set the stroke pattern\n\ncanvas-\u003eadd(path);                           //add the path to the canvas\n\n```\n\nThe code generates the following result:\n\n\u003cp align=\"center\"\u003e\n  \u003cimg width=\"300\" height=\"auto\" src=\"https://github.com/thorvg/thorvg.site/blob/main/readme/example_path.png\"\u003e\n\u003c/p\u003e\n\nNow begin rendering \u0026 finish it at a particular time:\n\n```cpp\ncanvas-\u003edraw();\ncanvas-\u003esync();\n```\n\nThen you can acquire the rendered image from the buffer memory.\n\nLastly, terminate the engine after its usage:\n\n```cpp\ntvg::Initializer::term();\n```\n[Back to contents](#contents)\n\u003cbr /\u003e\n\u003cbr /\u003e\n## SVG\n\nThorVG facilitates [SVG Tiny Specification](https://www.w3.org/TR/SVGTiny12/) rendering via its dedicated SVG interpreter. Adhering to the SVG Tiny Specification, the implementation maintains a lightweight profile, rendering it particularly advantageous for embedded systems. While ThorVG comprehensively adheres to [most of the SVG Tiny specs](https://github.com/thorvg/thorvg/wiki/SVG-Support), certain features remain unsupported within the current framework. These include:\u003c/br\u003e\n\n - Animation \n - Interactivity\n - Multimedia\n\nThe figure below highlights ThorVG's SVG rendering capabilities:\n\n\u003cp align=\"center\"\u003e\n  \u003cimg width=\"780\" height=\"auto\" src=\"https://github.com/thorvg/thorvg.site/blob/main/readme/example_svg.jpg\"\u003e\n\u003c/p\u003e\n\nThe following code snippet shows how to draw SVG image using ThorVG:\n\n```cpp\nauto picture = tvg::Picture::gen();         //generate a picture\npicture-\u003eload(\"tiger.svg\");                 //load a SVG file\ncanvas-\u003eadd(picture);                       //add the picture to the canvas\n```\n\nThe result is:\n\n\u003cp align=\"center\"\u003e\n  \u003cimg width=\"300\" height=\"auto\" src=\"https://github.com/thorvg/thorvg.site/blob/main/readme/example_tiger.png\"\u003e\n\u003c/p\u003e\n\n[Back to contents](#contents)\n\u003cbr /\u003e\n\u003cbr /\u003e\n## Lottie\n\nThorVG supports a wide range of [Lottie animation features](https://github.com/thorvg/thorvg/wiki/Lottie-Support). Lottie is an industry-standard, JSON-based vector animation format that enables animations to be distributed seamlessly across platforms, much like static assets. Lottie files are compact, compatible with a wide range of devices, and can be scaled without pixelation. The format also makes it easy to create, edit, test, collaborate on, and distribute animations. For more information, visit the [Lottie Animation Community](https://lottie.github.io/) website.\n\n\u003cp align=\"center\"\u003e\n  \u003cimg width=\"600\" height=\"auto\" src=\"https://github.com/thorvg/thorvg.site/blob/main/readme/example_lottie.gif\"\u003e\n\u003c/p\u003e\n\nPlease check out the [ThorVG Test](https://thorvg-perf-test.vercel.app/) to explore the performance of various Lottie animations powered by ThorVG. For frontend developement, you can also install [ThorVG Lottie Player npm package](https://www.npmjs.com/package/@thorvg/lottie-player).\n\n### Basic Usage\nThorVG offers flexibility in configuring its binary. In addition to serving as a general-purpose graphics engine, it can be built as a compact Lottie animation playback library using specific build options:\n\n```\n$meson setup builddir -Dloaders=\"lottie, ...\"\n```\n\nAlternatively, enable all loaders available for Lottie:\n\n```\n$meson setup builddir -Dloaders=\"all\"\n```\n\nThe following example demonstrates how to play a Lottie animation with ThorVG:\n\n```cpp\nauto animation = tvg::Animation::gen();     //generate an animation\nauto picture = animation-\u003epicture();        //acquire a picture which associated with the animation.\npicture-\u003eload(\"lottie.json\");               //load a Lottie file\nauto duration = animation-\u003eduration();      //figure out the animation duration time in seconds.\ncanvas-\u003eadd(picture);                       //add the picture to the canvas\n```\nFirst, create an animation and retrieve its associated picture. Load the Lottie file (lottie.json) into the picture, and then add the picture to the canvas. Use the animation object to control the frames during playback. You can also retrieve the animation duration when implementing the playback loop.\n```cpp\nanimation-\u003eframe(animation-\u003etotalFrame() * progress);  //Set a current animation frame to display\n```\nThe progress variable represents the animation position, ranging from 0 to 1 over its total duration. Adjust it to display the animation at the desired position, and then update the canvas to redraw the corresponding frame.\n\n### Expressions\n\nThorVG supports Lottie Expressions, enabling small JavaScript snippets to dynamically control animated properties. This unlocks advanced capabilities such as interactivity, dynamic theming, and context-aware animation behavior. However, expressions are not currently part of the official Lottie specification and may increase binary size or affect performance, especially on resource-constrained devices. ThorVG therefore disables expression support by default; enable it explicitly with the `extra` build option when required:\n\n```\n$meson setup builddir -Dloaders=\"lottie, ...\" -Dextra=\"lottie_exp, ...\"\n```\n\n\u003cp align=\"center\"\u003e\n  \u003cimg width=\"700\" height=\"auto\" src=\"https://github.com/thorvg/thorvg.site/blob/main/readme/example_expressions.gif\"\u003e\n\u003c/p\u003e\n\n[Back to contents](#contents)\n\u003cbr /\u003e\n\u003cbr /\u003e\n## In Practice\n\n### Camtasia\n[Camtasia](https://www.techsmith.com/camtasia/) adopted ThorVG for Lottie rendering, enabling customizable animations and dynamic color adjustments.\n\n\u003cp align=\"center\"\u003e\n  \u003cimg width=\"700\" height=\"auto\" src=\"https://github.com/thorvg/thorvg.site/blob/main/readme/example_camtasia.png\"\u003e\n\u003c/p\u003e\n\n### Canva iOS\n[Canva](https://www.canva.com) adopted ThorVG for Lottie rendering on iOS, delivering up to 80% faster rendering and 70% lower peak memory usage.\n\n\u003cp align=\"center\"\u003e\n  \u003cimg width=\"700\" height=\"auto\" src=\"https://github.com/thorvg/thorvg.site/blob/main/readme/example_canvaios.png\"\u003e\n\u003c/p\u003e\n\n### dotLottie\n[dotLottie](https://dotlottie.io/) is an open-source format for packaging Lottie animations and assets. Its player uses ThorVG for efficient rendering.\n\n\u003cp align=\"center\"\u003e\n  \u003cimg width=\"700\" height=\"auto\" src=\"https://github.com/thorvg/thorvg.site/blob/main/readme/example_dotlottie.png\"\u003e\n\u003c/p\u003e\n\n### Espressif\n[Espressif Systems](https://www.espressif.com/en) provides ThorVG as an official ESP-IDF component for ESP32 and ESP32-P4 vector graphics.\n\n\u003cp align=\"center\"\u003e\n  \u003cimg width=\"700\" height=\"auto\" src=\"https://github.com/thorvg/thorvg.site/blob/main/readme/example_espressif.png\"\u003e\n\u003c/p\u003e\n\n### Godot\n[Godot](https://www.godotengine.org) integrates ThorVG to enable high-quality vector-based UI and assets in its open-source game engine.\n\n\u003cp align=\"center\"\u003e\n  \u003cimg width=\"700\" height=\"auto\" src=\"https://github.com/thorvg/thorvg.site/blob/main/readme/example_godot.png\"\u003e\n\u003c/p\u003e\n\n### Lottie Creator\n[Lottie Creator](https://creator.lottiefiles.com/) leverages ThorVG to power its Canvas engine with fast, scalable vector rendering for interactive animations.\n\n\u003cp align=\"center\"\u003e\n  \u003cimg width=\"700\" height=\"auto\" src=\"https://github.com/thorvg/thorvg.site/blob/main/readme/example_creator.png\"\u003e\n\u003c/p\u003e\n\n### LVGL\n[LVGL](https://lvgl.io/) is an open-source graphics library leveraging ThorVG as its vector drawing primitives library for embedded systems.\n\n\u003cp align=\"center\"\u003e\n  \u003cimg width=\"700\" height=\"auto\" src=\"https://github.com/thorvg/thorvg.site/blob/main/readme/example_lvgl.png\"\u003e\n\u003c/p\u003e\n\n### SEGGER\n[SEGGER](https://www.segger.com/) uses ThorVG as a GPU driver for high-performance vector rendering in embedded GUIs.\n\n\u003cp align=\"center\"\u003e\n  \u003cimg width=\"700\" height=\"auto\" src=\"https://github.com/thorvg/thorvg.site/blob/main/readme/example_segger.png\"\u003e\n\u003c/p\u003e\n\n### Tizen\n[Tizen](https://www.tizen.org), an open-source platform integrating ThorVG as its vector graphics backend for rendering primitives, SVG, and Lottie animations.\n\n\u003cp align=\"center\"\u003e\n  \u003cimg width=\"700\" height=\"auto\" src=\"https://github.com/thorvg/thorvg.site/blob/main/readme/example_tizen.png\"\u003e\n\u003c/p\u003e\n\nDiscover more projects in our [Showcase](https://www.thorvg.org/showcase). Using ThorVG in your project? Feel free to contact us at thorvg@thorvg.org to get featured!\n\n[Back to contents](#contents)\n\u003cbr /\u003e\n\u003cbr /\u003e\n## ThorVG Demo\n### Thor Janitor\n[Thor Janitor](https://github.com/thorvg/thorvg.janitor), an interactive demo game fully rendered using ThorVG. It renders tens of thousands of objects in real-time with effects like DropShadow and Blur, running stably at 120+ FPS! [Give it a try!](https://thorvg-janitor.vercel.app/)\n\n\u003cp align=\"center\"\u003e\n  \u003cimg width=\"700\" height=\"auto\" src=\"https://github.com/user-attachments/assets/8a4bd16a-bb72-4b41-b007-eadc2220d1eb\"/\u003e\n\u003c/p\u003e\n\n\u003cp align=\"center\"\u003e\n  \u003cstrong\u003e\u003ca href=\"https://youtu.be/jdnnzmtHy9k\"\u003eWatch the full video!\u003c/a\u003e\u003c/strong\u003e\n\u003c/p\u003e\n\n### Thor Pirates\nCheck out [Thor Pirates](https://github.com/thorvg/thorvg.demo.pirates). Every visual is rendered as real-time vector graphics, featuring physics-based cannon battles, dynamic water, ship debris, and interactive environmental effects. The entire game was built with AI-generated code using [Codex](https://chatgpt.com/codex/?utm_source=google\u0026utm_medium=paid_search\u0026c_id=24184441561\u0026c_agid=203310201807\u0026c_crid=822144559839\u0026c_kwid=kwd-111182835\u0026c_ims=\u0026c_pms=9197166\u0026c_nw=g\u0026c_dvc=c\u0026gad_source=1\u0026gad_campaignid=24184441561\u0026gbraid=0AAAAA-I0E5f01DRDjTP8rQ_p9rY5vklen\u0026gclid=Cj0KCQjw5bjVBhCiARIsAJzMVnQf5XBIme-UebEIZUoYXOpv0NfPBbLdpAymExeO3H3gMSpog_nohNYaAl4sEALw_wcB), showcasing how naturally ThorVG’s retained structural APIs work with AI. [Give it a try!](https://thorvg-pirates.vercel.app/)\n\n\u003cp align=\"center\"\u003e\n  \u003cimg width=\"700\" height=\"auto\" alt=\"thorvg\" src=\"https://github.com/user-attachments/assets/cda8e26e-acbc-44fb-9b16-4c50b3b991f6\" /\u003e\n\u003c/p\u003e\n\n\u003cp align=\"center\"\u003e\n  \u003cstrong\u003e\u003ca href=\"https://youtu.be/eBvL9oUaQ3A?si=AKmsjYn25uMLLoFB\"\u003eWatch the full video!\u003c/a\u003e\u003c/strong\u003e\n\u003c/p\u003e\n\n[Back to contents](#contents)\n\u003cbr /\u003e\n\u003cbr /\u003e\n## Examples\n\n### C++ Examples\nA wide range of native sample codes is available in the [thorvg.example](https://github.com/thorvg/thorvg.example) repository to help you understand and work with the ThorVG C++ APIs.\n\n### Playground\nThe [ThorVG Playground](https://www.thorvg.org/playground) is an interactive web-based environment where you can explore various graphic features and instantly see the results in real time.\n\n[Back to contents](#contents)\n\u003cbr /\u003e\n\u003cbr /\u003e\n## Tools\n### ThorVG View\n\n[ThorVG view](https://thorvg.github.io/thorvg.view/) is an interactive web tool for testing and validating vector and motion graphics assets with ThorVG. It provides a quick way to verify how standard formats such as SVG and Lottie are parsed, rendered, and animated by the engine. \u003cbr /\u003e\n\u003cbr /\u003e\nPowered by ThorVG WebAssembly, assets are rendered directly in the browser with no server-side processing, making it useful for compatibility testing, visual inspection, debugging, and experimenting with asset behavior in real time.\n\u003c/br\u003e\n\n\u003cp align=\"center\"\u003e\n  \u003cimg width=\"1000\" height=\"auto\" src=\"https://github.com/thorvg/thorvg.site/blob/main/readme/example_thorvgview.gif\"/\u003e\n\u003c/p\u003e\n\n### VS Code LiveView\nA [Visual Studio Code extension](https://marketplace.visualstudio.com/items?itemName=thorvg.thorvg-liveview) that integrates ThorVG View for previewing Lottie animations and SVG files directly inside the editor.\n\u003c/br\u003e\n\n\u003cp align=\"center\"\u003e\n  \u003cimg width=\"1000\" height=\"auto\" src=\"https://github.com/thorvg/thorvg.site/blob/main/readme/example_vscode.gif\"/\u003e\n\u003c/p\u003e\n\n### CLI Tools\n[CLI Tools](https://github.com/thorvg/thorvg.cli-tools/) provides lightweight command-line tools, including **svg2png** for converting SVG files to PNG images and **lottie2gif** for converting Lottie animations to animated GIFs.\n\u003cbr /\u003e\n\n[Back to contents](#contents)\n\u003cbr /\u003e\n\u003cbr /\u003e\n## Related Projects\nThorVG is designed to be portable and extensible across various platforms. The following projects integrate ThorVG into specific environments or tools: \u003c/br \u003e\n\n* [ThorVG Android](https://github.com/thorvg/thorvg.android) – Kotlin-based ThorVG support for Android.\n* [ThorVG Flutter](https://github.com/thorvg/thorvg.flutter) - A Flutter plugin for using ThorVG on Android and iOS.\n* [ThorVG Swift](https://github.com/thorvg/thorvg.swift) - Swift bindings for rendering vector graphics with ThorVG.\n* [ThorVG Toolkit](https://github.com/thorvg/thorvg.toolkit) - A lightweight toolkit for ThorVG app development.\n* [ThorVG Unity](https://github.com/thorvg/thorvg.unity) – ThorVG integration for Unity using C#.\n* [ThorVG Web](https://github.com/thorvg/thorvg.web) - WebAssembly-based integration of ThorVG for web apps.\n\n[Back to contents](#contents)\n\u003cbr /\u003e\n\u003cbr /\u003e\n\n## API Bindings\nOur main development APIs are written in C++, but ThorVG also provides API bindings for C.\n\nTo enable CAPI binding, you need to activate this feature in the build options:\n```\nmeson setup builddir -Dbindings=\"capi\"\n```\n[Back to contents](#contents)\n\u003cbr /\u003e\n\u003cbr /\u003e\n## Documentation\nThe ThorVG API documentation is available at [thorvg.org/apis](https://www.thorvg.org/apis), and can also be found directly in this repository via the [C++ API](https://github.com/thorvg/thorvg/blob/main/inc/thorvg.h) and [C API](https://github.com/thorvg/thorvg/blob/main/src/bindings/capi/thorvg_capi.h). \n\nFor comprehensive and well-structured technical information, please visit the [DeepWiki](https://deepwiki.com/thorvg/thorvg), which offers in-depth guidance on ThorVG's architecture, features, and usage.\n\n[Back to contents](#contents)\n\u003cbr /\u003e\n\u003cbr /\u003e\n## Dependencies\nThorVG provides flexible image loading capabilities, supporting both static and external loaders. This design ensures that even in environments lacking external libraries, users can rely on built-in static loaders for core functionality. At its core, the ThorVG library is fully self-contained and operates without mandatory external dependencies. However, several optional feature extensions are available, each with its own set of dependencies.\n\nThe following outlines the dependencies for these optional features:\n\n* **CPU**: [OpenMP 2.0](https://www.openmp.org/) (optional)\n* **GL/WebGL**: [OpenGL 3.3](https://www.khronos.org/opengl/), [OpenGL ES 3.0](https://www.khronos.org/opengles/), or a browser with [WebGL2](https://www.khronos.org/webgl/) support.\n* **WebGPU**: [wgpu-native v29.0.1.1](https://github.com/gfx-rs/wgpu-native) or a browser with [WebGPU](https://www.w3.org/TR/webgpu/) support.\n* **PNG** (external): [libpng](https://github.com/pnggroup/libpng)\n* **JPEG** (external): [libjpeg-turbo](https://github.com/libjpeg-turbo/libjpeg-turbo)\n* **WebP** (external): [libwebp](https://developers.google.com/speed/webp/download)\n\n[Back to contents](#contents)\n\u003cbr /\u003e\n\u003cbr /\u003e\n## Contributors\nThorVG stands as a purely open-source initiative. We are grateful to the individuals, organizations, and companies that have contributed to the development of the ThorVG project. The dedicated efforts of the individuals and entities listed below have enabled ThorVG to reach its current state.\n\n* [Individuals](https://github.com/thorvg/thorvg/blob/main/CONTRIBUTORS.md)\n* [Canva Pty Ltd](https://www.canva.com/)\n* [Godot](https://godotengine.org/)\n* [LVGL](https://lvgl.io/)\n\n[Back to contents](#contents)\n\u003cbr /\u003e\n\u003cbr /\u003e\n## Partners\nCorporate partners collaborate with ThorVG through development, integration, and strategic initiatives that help advance the project. \n\u003cbr /\u003e\n\u003cbr /\u003e\n\u003cp align=\"center\", href=\"https://www.lottiefiles.com\"\u003e\n  \u003ca href=\"https://www.lottiefiles.com\"\u003e\n  \u003cimg width=\"250\" height=\"auto\" src=\"https://github.com/thorvg/thorvg.site/blob/main/readme/partner_lottiefiles.jpg\"  alt=\"LottieFiles\"\u003e\n  \u003c/a\u003e\n\u003c/p\u003e\n\u003cbr /\u003e\nWe also recognize past partners whose contributions have played an important role in ThorVG’s growth.\n\u003cbr /\u003e\n\u003cbr /\u003e\n\u003cp align=\"center\", href=\"https://wwww.samsung.com\"\u003e\n  \u003ca href=\"https://www.samsung.com\"\u003e\n  \u003cimg width=\"250\" height=\"auto\" src=\"https://github.com/thorvg/thorvg.site/blob/main/readme/partner_samsung.jpg\"  alt=\"Samsung\"\u003e\n  \u003c/a\u003e\n\u003c/p\u003e\n\u003cbr /\u003e\n\nIf you’re interested in partnering with ThorVG, we’d love to hear from you. Please reach out at thorvg@thorvg.org\n\n[Back to contents](#contents)\n\u003cbr /\u003e\n\u003cbr /\u003e\n## Sponsors\nWe sincerely thank all of our sponsors, past and present, whose financial support has helped shape the evolution of ThorVG. Your generosity is more than a contribution—it is an investment in a high-performance, accessible graphics engine built for real-world production.\n\u003cbr/\u003e\n\u003cbr/\u003e\n\n\u003cp align=\"center\", href=\"https://www.lottiefiles.com\"\u003e\n  \u003ca href=\"https://www.lottiefiles.com\"\u003e\n  \u003cimg width=\"250\" height=\"auto\" src=\"https://github.com/thorvg/thorvg.site/blob/main/readme/partner_lottiefiles.jpg\"  alt=\"LottieFiles\"\u003e\n  \u003c/a\u003e\n\u003c/p\u003e\n\u003cp align=\"center\", href=\"https://paragraphic.design/\"\u003e\n  \u003ca href=\"https://paragraphic.design/\"\u003e\n  \u003cimg width=\"250\" height=\"auto\" src=\"https://github.com/thorvg/thorvg.site/blob/main/readme/sponsor_paragraphic.png\"  alt=\"Paragraphic\"\u003e\n  \u003c/a\u003e\n\u003c/p\u003e\n\u003cbr/\u003e\nThorVG is designed to remain open, accessible, and community-driven. To help ensure long-term sustainability and faster technical iteration, we provide additional support channels for our corporate and professional sponsors.\n\u003cbr/\u003e\n\u003cbr/\u003e\n\n* [GitHub Sponsors](https://github.com/sponsors/thorvg)\n* [Open Collective](https://opencollective.com/thorvg)\n\n[Back to contents](#contents)\n\u003cbr /\u003e\n\u003cbr /\u003e\n## Communication\nFor real-time conversations and discussions, please join us on [Discord](https://discord.gg/n25xj6J6HM)\n\n[Back to contents](#contents)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fthorvg%2Fthorvg","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fthorvg%2Fthorvg","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fthorvg%2Fthorvg/lists"}