SplatThis

Convert a bitmap into Gaussian splats and deploy them as browser-rendered SVG, scriptless CSS, browser-native Canvas primitives, an accelerated pixel runtime with exact CPU fallbacks, or native editable PowerPoint shapes.

SplatThis is target-aware. It does not pretend that native Canvas, CSS, SVG, PowerPoint, and a generated pixel framebuffer render the same primitives: each output is named and evaluated for what it actually does.

Chromium is the governing pixel-runtime, native Canvas, SVG, and CSS target. CairoSVG, librsvg, and the internal NumPy renderer cannot approve a browser-native candidate or support a deployed-fidelity claim.

See it

One 476x502 photograph, fitted to Gaussian splats and emitted to three compositors that share no rendering code. The middle image is a real SVG, not a raster of one — your browser is drawing 1,615 gradient ellipses.

Source photograph	Native SVG	Native PowerPoint
the input	0.8665 SSIM · vector · 1.5 MB	0.7885 SSIM · editable shapes · 161 KB

The third image is the only screenshot here, and it has to be: it is Microsoft PowerPoint in slideshow, photographed, because there is no other honest way to show what PowerPoint actually draws. Its score is measured through that capture and is therefore a lower bound.

Open the scriptless CSS build →   0.8748 SSIM · 0.8 MB · no script, no canvas, no SVG, no bitmap

That one is deliberately a link rather than a picture. It is 1,615 DOM elements with CSS radial gradients, and a screenshot of it would be indistinguishable from a screenshot of anything else — the point is that your browser is compositing it from a stylesheet. View source on it.

Also available: the editable .pptx, the historical self-contained pixel-runtime HTML, and a larger corpus overview.

_{Scores are SSIM_sRGB against the source at 364x384, measured on the deployed artifact in its governing renderer — Chromium for SVG and CSS, a real PowerPoint slideshow capture for the deck. SVG and CSS share one 1,615-splat population, so their difference is purely compositor; the deck is a separate 1,674-splat run and is not a like-for-like comparison against them. The SVG and CSS candidates were selected by re-scoring every surviving artifact rather than by trusting recorded metrics — rerun with python tools/refresh_showcase.py --dry-run.}

Install

SplatThis requires Python 3.13 or newer and an installed Google Chrome for governing pixel-runtime/Canvas/CSS/SVG capture.

git clone https://github.com/BramAlkema/SplatThis.git
cd SplatThis
python3.13 -m venv venv
source venv/bin/activate
python -m pip install --upgrade pip
pip install -e ".[capture]"

The capture extra installs the Playwright client and uses the installed Chrome. It does not depend on the sibling svg2pptx repository.

On Apple Silicon, add MLX:

pip install -e ".[capture,mlx]"

On CPU or CUDA machines, select Torch explicitly:

splatthis input.png --optimizer-backend torch

If Chrome is unavailable, pixel-runtime, native Canvas, SVG, and CSS exports can still be written, but their acceptance fails closed. Any internal proxy metrics are marked as diagnostics rather than deployed-artifact evidence.

Quick start

Create each supported output from the same image:

# Highest-fidelity runtime; accelerated splat equations with exact CPU fallbacks.
splatthis input.png --format pixel-runtime -o output-pixels.html

# Browser-native Canvas 2D gradient splats.
splatthis input.png --format canvas -o output-canvas.html

# Scriptless DOM/CSS splats; no canvas, SVG, JavaScript, or embedded bitmap.
splatthis input.png --format css -o output-css.html

# Static, editable SVG evaluated in Chromium.
splatthis input.png --format svg -o output.svg

# Native DrawingML splats; gradient is the conservative default.
splatthis input.png --format pptx -o output.pptx

Keep a complete audit trail with --artifacts-dir:

splatthis input.png --format svg -o output.svg \
  --artifacts-dir ./tmp/input-svg-run

The directory contains the run manifest, stage checkpoints, metrics, renderer identity, and acceptance decision.

Choose a quality budget

The default budget is 2,000 splats. More splats only help when initialization and training are allowed to use them.

# Practical larger pixel-runtime run.
splatthis input.png --format pixel-runtime -o output-4k.html \
  --splats 4000 --initial-splat-cap 4000

# Bound resolution and let a preset choose the schedule and detail budget.
splatthis input.png --format pixel-runtime -o output.html \
  --max-edge 384 --time-budget 10m

For an explicit quality target, the default-off pixel-runtime controller can stop before later stages once an observed checkpoint reaches the desired exact CPU-boundary score; the selected final browser backend is graded separately:

splatthis input.png --format pixel-runtime -o output.html \
  --splats 4000 --initial-splat-cap 4000 \
  --adaptive-compute --adaptive-target-ssim-srgb 0.98

This controller does not predict future quality or stop on a plateau. It only acts on already-rendered checkpoints.

Static pixel-runtime HTML selects one runtime in this order: RGBA32F WebGL2, RGBA16F WebGL2, exact Worker/OffscreenCanvas CPU, then exact main-thread CPU. The 16F path must also pass a cheap deterministic sample against the exact formula. The selected path and its compute/end-to-end timings are exposed in the document metadata, and governing Chromium capture grades that actual canvas buffer. ?splatthisPixelBackend=rgba32f|rgba16f|worker|main is available for diagnostics. The current 21-image Chrome gate selected 32F everywhere, kept its worst source SSIM_sRGB change to -0.0000014, and found exact Worker/main parity. Cross-browser GPU qualification remains open; unsupported or rejected GPU paths fall back rather than preventing rendering.

SVG workflows

The standard recipe is the safe static default. Other recipes are explicit:

splatthis input.png --format svg -o compact.svg \
  --svg-recipe palette-quantized

splatthis input.png --format svg -o polished.svg \
  --fidelity-stage max --artifacts-dir ./tmp/polished-svg-run

# Force the stricter adaptive stop policy without artifact search.
splatthis input.png --format svg -o high.svg \
  --svg-gradient-quality high --no-svg-compositor-gate

SVG elements are emitted back-to-front so their painter's order matches the front-to-back transmittance renderer. The max-fidelity profile additionally browser-grades legacy order, corrected standard gradients, and corrected high gradients, then accepts or reverts the complete artifact. Its decision and fixed ROIs are stored under svg_compositor_gate in the manifest. See the SVG compositor gate.

The separate fidelity stage emits every splat-parameter candidate and captures it in Chromium. A proxy may reject a cheap loser early, but only the browser artifact can promote a candidate. --svg-optimize can additionally run svgo when it is available on PATH.

The bounded browser recipe study accepted palette quantization on 7 of 21 corpus images, with 66–71% smaller accepted files and a median accepted LPIPS gain of 0.01014. This does not make it a universal default; see the browser SVG recipe gate.

Scriptless CSS compositor

The CSS target represents every Gaussian as one absolutely positioned ellipse. Its background is a CSS radial-gradient with adaptive alpha stops matching the standard SVG Gaussian curve. The browser performs the final alpha-over composition; SplatThis does not pre-render a pixel buffer.

# Static CSS splats.
splatthis input.png --format css -o splats.html

# Scriptless 10x10 hover-grid parallax from saliency depth layers.
splatthis input.png --format css -o parallax-css.html \
  --layered-saliency --css-parallax-strength 28

The parallax output uses transparent hover cells and CSS sibling selectors to move the midground and foreground planes. It remains interactive with a strict no-script policy. The governing quality capture measures the neutral, non-hovered frame. This target trades runtime code for DOM size: one element per splat is convenient and inspectable, but thousands of DOM nodes can cost more layout and paint work than the single Canvas element.

PowerPoint workflows

PowerPoint output contains native shapes rather than a bitmap masquerading as a slide:

# Recommended general-purpose PowerPoint output.
splatthis input.png --format pptx -o output.pptx \
  --pptx-splat-style gradient

# Explicit corrected painter-order candidate; legacy remains the default.
splatthis input.png --format pptx -o output-corrected.pptx \
  --pptx-painter-order back-to-front

# Deliberately target real PowerPoint's soft-edge compositor.
splatthis input.png --format pptx -o output-softedge.pptx \
  --pptx-splat-style soft-edge \
  --training-export-target pptx-softedge

PowerPoint and LibreOffice do not render every DrawingML effect identically. The pptx-softedge target is calibrated for Microsoft PowerPoint and may look washed out elsewhere. In-converter PPTX previews remain proxies; benchmark claims use real PowerPoint slideshow captures.

A same-population, 21-image PowerPoint corpus test found that corrected back-to-front shape order improved median SSIM by 0.02662 and median LPIPS by 0.03346, but Hubble regressed. The strict artifact policy selected corrected order for 14 images and retained legacy for seven. The CLI therefore exposes both orders while retaining legacy as the default. The resumable external PowerPoint runner writes the accepted candidate atomically as selected.pptx; ordinary headless conversion never launches PowerPoint. See the PowerPoint painter-order MVP.

Layered Canvas parallax

Splat layers can be displaced by mouse position to suggest depth:

splatthis input.png --format canvas -o parallax.html \
  --layered-saliency --canvas-parallax-strength 28

This version draws every Gaussian through the Canvas 2D API before moving the three resulting Canvas planes. The software-rasterized equivalent is available explicitly with --format pixel-runtime and --pixel-runtime-parallax-strength.

This changes presentation, not the underlying 2D reconstruction. PowerPoint hover/grid parallax remains an MVP design rather than a released exporter feature.

What quality to expect

These are seed-0 medians over all 21 stored corpus images at a maximum edge of roughly 384 px. Each score comes from the deployed artifact: the historical Chrome ImageData pixel buffer, Chromium SVG, or Microsoft PowerPoint.

These historical Canvas-labelled results belong to the ImageData software renderer now named pixel-runtime. All 21 images improved from 2k to effective 4k in both SSIM and LPIPS. The effective-4k runtime rendered in a median 105 ms in Chrome. None reached 0.99 SSIM.

An initial same-population Chameleon check makes the distinction concrete. The population contains 1,615 SVG-trained splats. Historical forward DOM order scored 0.7076 SSIM, corrected standard order scored 0.8494, and corrected adaptive high gradients scored 0.8665. Native Canvas scored 0.7072 under its historical order. Replaying the same parameters through the mathematical pixel runtime scored 0.9045, demonstrating the remaining vector-to-pixel-runtime gap. The older internal preview scored 0.8803 but was not an SVG render and must not be compared as one. Native Canvas rendered the gradients in about 11 ms and produced 156 KB of HTML; the CPU pixel runtime took roughly 80-102 ms and produced about 290 KB. These are one-image MVP measurements, not corpus guarantees.

On a separate 1,788-splat, 476 x 502 Chameleon checkpoint, the selected 32F runtime completed in roughly 16-19 ms after warm-up versus roughly 127-140 ms for exact main-thread CPU. It differed on six pixels by one byte and preserved source SSIM_sRGB at 0.90494. The quality-gated 16F path completed in about 20 ms; its source SSIM_sRGB was 0.90486. These remain local Chrome measurements, not a cross-browser guarantee.

SplatThis is also not a replacement for PNG, JPEG, WebP, or AVIF compression. If editability, animation, or the splat representation is unnecessary, a normal bitmap will usually be smaller and more faithful.

See historical pixel-runtime scaling for paired per-image results and SVG/PPTX compositor findings for the format-specific analysis.

How it works

1. Content-adaptive initialization places anisotropic splats.
2. Torch or MLX optimizes position, scale, rotation, color, and alpha.
3. Densification adds detail and pruning removes low-impact splats.
4. Target-aware post-fit stages approximate the deployment compositor.
5. Monotonic gates keep only measured improvements.
6. The final SVG, CSS/Canvas/pixel-runtime HTML, or DrawingML package is written atomically.

The public converter.py module is a small compatibility facade over the internal numerical engine and isolated prepare, fit, and deployment phases. Each run starts from an immutable configuration snapshot, produces one SplatScene, and delegates emission plus governing evaluation to a registered artifact backend. See Architecture for the module boundaries and extension rules.

Pixel-runtime and SVG repeat-render noise is currently zero in the calibrated corpus captures. Native Canvas and CSS still need their own full-corpus noise calibration. The versioned target floors and PowerPoint capture provenance live in data/artifact-gates.json.

Main flags

Run splatthis --help for the full research and backend surface.

Project status

The supported path includes target-aware training, native Canvas/CSS/SVG, explicit pixel-runtime and PPTX export, browser pixel-runtime/Canvas/SVG/CSS grading, native PowerPoint generation, provenance-complete manifests, and full-corpus reporting. See Reproducibility for what a fixed seed does and does not guarantee per backend.

Top-K teacher/student distillation, mixed native primitives, automatic SVG recipe selection, adaptive compute, and PowerPoint hover parallax remain default-off or experimental. Their current evidence is retained under docs/ rather than presented as release guarantees. The architecture and acceptance roadmap are in ADR-003.

Development

pip install -e ".[dev,capture]"

isort --check-only src tests tools
black --check src tests tools
flake8 src tests tools
pytest -q
python -m build
python -m twine check dist/*

Reproducibility

A fixed --seed reproduces the reported metrics on both backends, but only Torch reproduces the emitted artifact byte for byte.

MLX orders float32 reductions on the Metal device nondeterministically, so repeated single-process seeded runs differ by roughly one float32 ULP (~3e-8) in splat parameters. That is far below any quality threshold — two seeded runs of the same image agreed on SSIM to nine significant figures — but it is enough to tip a rounded SVG attribute across a formatting boundary, so artifact hashes are not stable under MLX. The differences observed so far have been geometrically inert, such as the rotate() angle of an isotropic splat, where rotation is a no-op. Select --optimizer-backend torch when you need bit-identical output or a stable artifact hash.

The corpus medians quoted above are unaffected: they are reported to four decimal places, five orders of magnitude above this noise.

Corpus runs are content-addressed and resumable. Independent conversions can run concurrently with python tools/corpus_benchmark.py --run --jobs 2 .... This is restricted to Torch/CPU runs: concurrent seeded MLX processes share one Metal device and compound the nondeterminism described above. MLX therefore requires --jobs 1; result-file writes remain serialized for every backend.

CI launches the installed Chrome before running the suite. See CONTRIBUTING.md and CHANGELOG.md.

License

MIT