mediacrumbs

simplesnip.com

Free Photoshop in your browser

SimpleSnip

Edit images, remove backgrounds, add text and effects — no download, no subscription, just open and create.

ReactCanvas APITypeScriptVite

Visit site ↗

Deep dive

Why I built it

I kept running into the same situation: needing a quick image edit — crop, remove a background, add some text — and every tool either wanted a download or a monthly subscription. I wanted something that just worked instantly in the browser, completely free.

How I built it

Built on the HTML5 Canvas API with React managing the UI layer. Background removal runs entirely client-side using edge detection and alpha channel manipulation, so nothing ever leaves the user's device. The layer system tracks operations as a stack so undo/redo is always available.

Feature highlights

Background Removal

One-click background removal powered by client-side image processing — no server, no upload.

Text & Layers

Add text, shapes and adjustments with a familiar layer-based workflow.

Browser-only Export

Export to PNG, JPG or WebP with quality control. Processing is 100% local.

Core snippet

// Client-side background removal — runs entirely in the browser
const { data } = ctx.getImageData(0, 0, w, h)
const [r0, g0, b0] = [data[0], data[1], data[2]]

for (let i = 0; i < data.length; i += 4) {
  const diff = Math.abs(data[i]     - r0)
             + Math.abs(data[i + 1] - g0)
             + Math.abs(data[i + 2] - b0)
  if (diff < threshold) data[i + 3] = 0   // make pixel transparent
}
ctx.putImageData(new ImageData(data, w, h), 0, 0)

tabletopcalculator.com

Warhammer 40K combat calculator

Tabletop Calculator

Pit units against each other in melee and ranged combat — instantly see how fights play out without stopping the game.

ReactTypeScriptProbability EngineJSON Data

Visit site ↗

Deep dive

Why I built it

Doing combat math mid-game kills the pace. I wanted a fast, accurate tool where you input two units, pick weapons and special abilities, and instantly see the probable outcome — so you can make strategic decisions without grabbing a calculator.

How I built it

The core is a probability engine that models the full Warhammer 40K attack sequence — hit rolls, wound rolls, armour saves, feel-no-pain saves, damage — as a Markov chain. This gives exact probability distributions rather than just averages, so you see the full spread of outcomes. The unit database is a typed JSON structure that's easy to update when new datasheets drop.

Feature highlights

Full Attack Sequence

Models hit, wound, save and damage rolls with exact probability distributions via Markov chains.

Unit Database

Searchable database of units with stats, weapons and special abilities pre-loaded.

Side-by-Side Compare

Compare multiple attacker/defender combinations simultaneously.

Core snippet

// Full 40K attack sequence modelled as a probability chain
function rollSequence(atk, def) {
  const hit   = d6prob(atk.skill)
  const wound = hit   * woundRoll(atk.str, def.tough)
  const save  = wound * (1 - armourSave(def.save))
  const fnp   = save  * (1 - (def.fnp ?? 0))   // feel-no-pain
  return fnp * atk.damage
}

Projects

SimpleSnip

Tabletop Calculator

About

Upcoming