slughorn — GPU Vector Graphics
- Docs
- Examples
- GitHub ↗
GPU Vector Graphics, _Reimagined._
A modern C++20 library implementing the Slug GPU vector-graphics technique. Ingest SVG, FreeType, Blend2D, Cairo, Skia — **_or author shapes directly with the slughorn native Canvas API_** — then upload to OpenGL, Vulkan, WebGPU, DirectX, and more.
Documentation & Links
Everything You Need
``` import slughorn
Create an atlas — the GPU texture backing store
atlas = slughorn.Atlas(2048) canvas = slughorn.canvas.Canvas(atlas)
Build a layered composite shape
canvas.begin_composite()
Dark background fill
canvas.rect(0.0, 0.0, 1.0, 1.0) canvas.fill(slughorn.Color(0.12, 0.12, 0.14, 1.0), 1.0)
Gold gradient rounded panel
canvas.rounded_rect(0.06, 0.06, 0.94, 0.94, 0.09)
gradient = canvas.create_linear_gradient(0.0, 0.0, 1.0, 1.0, [ slughorn.GradientStop(0.0, slughorn.Color(0.55, 0.31, 0.02, 1.0)), slughorn.GradientStop(1.0, slughorn.Color(1.00, 0.85, 0.35, 1.0)), ])
canvas.fill_gradient(gradient, 1.0)
Circle punched through (opposite winding)
canvas.arc(0.5, 0.5, 0.28, 0.0, 2.0 * math.pi, True) canvas.fill()
canvas.finalize()
Build → textures ready for GPU upload
atlas.build()
curve_tex = atlas.curve_texture # RGBA32F band_tex = atlas.band_texture # RGBA16UI ```
``` #include <slughorn/canvas.hpp>
// Atlas is the GPU texture backing store slughorn::Atlas atlas(2048); slughorn::canvas::Canvas canvas(atlas);
// Two-stop gold gradient auto gradient = canvas.createLinearGradient( 0_cv, 0_cv, 1_cv, 1_cv, { slughorn::GradientStop{0_cv, {0.55_cv, 0.31_cv, 0.02_cv, 1_cv}}, slughorn::GradientStop{1_cv, {1_cv, 0.85_cv, 0.35_cv, 1_cv}} } );
// Build a layered composite shape canvas.beginComposite();
// Dark background fill canvas.rect(0_cv, 0_cv, 1_cv, 1_cv); canvas.fill({0.12_cv, 0.12_cv, 0.14_cv, 1_cv}, 1_cv);
// Gold gradient rounded panel canvas.roundedRect(0.06_cv, 0.06_cv, 0.94_cv, 0.94_cv, 0.09_cv); canvas.fillGradient(gradient, 1_cv);
// Circle punched through (opposite winding) canvas.arc(0.5_cv, 0.5_cv, 0.28_cv, 0_cv, 2_cv * slughorn::PI_CV, true) canvas.fill();
canvas.finalize();
// Build → textures ready for GPU upload atlas.build();
const auto& curveTex = atlas.getCurveTextureData(); // RGBA32F const auto& bandTex = atlas.getBandTextureData(); // RGBA16UI ```
The Canvas API mirrors the familiar browser `<canvas>` element. Composite shapes stack fills, strokes, and gradients into a single GPU-uploadable atlas with zero runtime tessellation overhead — the heavy lifting happens once at build time, leaving the GPU pipeline clean and fast.