explaingit

hu-qi/clearmatte-studio

Analysis updated 2026-06-24

1JavaScriptAudience · developerComplexity · 2/5Setup · moderate

TLDR

Static web app that removes image backgrounds in the browser using Transformers.js and the birefnet-lite-512 ONNX model, with no upload and no server.

Mindmap

mindmap
  root((clearmatte-studio))
    Inputs
      PNG image
      JPEG image
      WebP image
    Outputs
      Transparent PNG
      Flattened image
    Use Cases
      Cut out a product photo
      Make a transparent logo
      Preview against custom backgrounds
      Self-host private bg removal
    Tech Stack
      JavaScript
      TransformersJS
      ONNX
      WebGPU
      WASM
Click or tap to explore — scroll the page freely

Code map

Detail Auto

An interactive map of this repo's files and how they connect — its source is parsed live in your browser. Click Visualize to build it.

filefunction / class

What do people build with it?

USE CASE 1

Cut out a subject from a photo and export a transparent PNG without uploading the image

USE CASE 2

Self-host a private background removal tool behind HTTPS as static files

USE CASE 3

Preview a cut-out against checkerboard, white, dark, or custom color before export

USE CASE 4

Serve the BiRefNet model locally to avoid Hugging Face Hub calls from China

What is it built with?

JavaScriptTransformersJSONNXWebGPUWASM

How does it compare?

hu-qi/clearmatte-studioacip/slack-claude-agentalexanderdaly/neurofhe-relay
Stars111
LanguageJavaScriptJavaScriptJavaScript
Setup difficultymoderatemoderateeasy
Complexity2/53/52/5
Audiencedeveloperdeveloperresearcher

Figures from each repo's GitHub metadata at analysis time.

How do you get it running?

Difficulty · moderate Time to first run · 30min

Model files are not bundled, so you must download birefnet-lite-512 from Hugging Face into the local models folder before the app works offline.

In plain English

ClearMatte Studio is a small web app that removes the background from an image. The whole thing runs inside the browser, so the picture never leaves your computer. It is built as a static site using a JavaScript library called Transformers.js and an open model named birefnet-lite-512, which has been converted to the ONNX format so it can run on the web. The feature list is short. You can upload a PNG, JPEG, or WebP image. The app then runs alpha matting, which is the technique that figures out which pixels belong to the subject and which belong to the background. You can preview the cut-out result against a checkerboard grid, a white background, a dark background, or a custom color, and there are sliders for cutoff, softness, and cleanup before you export. The final image can be saved as a transparent PNG or flattened onto a color background. Running it locally is as simple as starting a Python HTTP server in the project folder and opening localhost:5173. The README notes that WebGPU needs a secure context, which localhost counts as, and that browsers without WebGPU support fall back to WASM, the WebAssembly runtime. The model itself is not bundled. The app first looks for it in a local directory under models/studioludens/birefnet-lite-512, which you populate by downloading the model from Hugging Face. Serving the files from the same site avoids cross-origin issues and means visitors do not need to reach Hugging Face from the browser. If the local copy is missing, the app falls back to fetching from the Hugging Face Hub. Visitors from mainland China are routed to the local copy first. URL parameters such as model=local, model=remote, model=hub, model=mirror, and mirror=0 or mirror=1 let you override the loading behavior for testing. Deployment is simple: upload the repository as static files behind HTTPS, with no build step or server runtime needed. The repository has 1 star at the time of writing.

Copy-paste prompts

Prompt 1
Walk me through running clearmatte-studio locally with a Python HTTP server on port 5173
Prompt 2
Show me how to download the birefnet-lite-512 model from Hugging Face into models/studioludens
Prompt 3
Explain the cutoff, softness, and cleanup sliders and when to adjust each one
Prompt 4
Help me deploy clearmatte-studio as static files behind HTTPS on Cloudflare Pages
Prompt 5
Tell me what the model=local, model=remote, model=hub, and mirror=1 URL parameters do

Frequently asked questions

What is clearmatte-studio?

Static web app that removes image backgrounds in the browser using Transformers.js and the birefnet-lite-512 ONNX model, with no upload and no server.

What language is clearmatte-studio written in?

Mainly JavaScript. The stack also includes JavaScript, TransformersJS, ONNX.

How hard is clearmatte-studio to set up?

Setup difficulty is rated moderate, with roughly 30min to a first successful run.

Who is clearmatte-studio for?

Mainly developer.

Open on GitHub → Explain another repo

This repo across BitVibe Labs

Verify against the repo before relying on details.