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.

User Guide (PDF) GitHub See Examples

Everything You Need

Examples

View All →
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
Rendered output

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.