Skip to content

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

5 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Bitbead

Bitbead

Turn any photo into a printable fuse bead pattern — free, in your browser.

Perler · Hama · Artkal · MARD · COCO

English · 简体中文 · 繁體中文 · 日本語 · 한국어

Open the site in your language: EN · 简体 · 繁體 · 日本語 · 한국어


What it does

Drop in a photo. Bitbead maps it onto a real bead brand's colour palette and gives you a print-ready chart with exact bead counts and a per-colour shopping list — so you know what to buy before you start, instead of running out of dark grey halfway through.

Everything runs locally in your browser. Your image is never uploaded to a server. No account needed to generate a pattern.

Supported brands

Bitbead ships the full published colour range for each brand — 1,406 palette entries in total:

Brand Palette Colours
Perler /colors/perler 117
Hama /colors/hama 89
Artkal /colors/artkal 176
Artkal Mini /colors/artkal-mini 221
MARD /colors/mard 221
MARD 291 /colors/mard-291 291
COCO /colors/coco 291

Every colour has its own page with the official code, hex value, and swatch — useful as a reference even if you never generate a pattern.

📊 Open dataset: cross-brand colour crosswalk

No bead manufacturer publishes machine-readable colour data, so we built it: data/ has all 1,406 colours plus 8,436 nearest-brand matches computed with CIEDE2000, as JSON and CSV, under CC BY 4.0.

curl -O https://raw.githubusercontent.com/pomodiary/bitbead.app/main/data/crosswalk.csv

The generator ships with it, so you can reproduce every number from palettes.json alone. Its CIEDE2000 implementation is checked against all 34 reference pairs from Sharma, Wu & Dalal (2005) on every run.

A few things the data turned up:

  • COCO and MARD 291 are the same colour set with different numbering. 290 of 291 hex values match, but only 48 codes appear in both — and each of those 48 means a different colour in each brand. Carrying a code across unchanged gets you the wrong bead.
  • MARD is a strict subset of MARD 291 — same codes, same hex, 70 fewer colours.
  • Converting to Hama is the hard direction. With 89 colours it can only match about a third of any other brand's palette within ΔE<5; saturated cyans have no equivalent at all.

See data/README.md for the schema, method and caveats.

Features

  • Photo → pattern with perceptual colour matching, not naive RGB distance
  • Exact bead counts per colour, plus a materials list you can shop from
  • Background removal — edge-aware detection so subjects come out clean
  • Editing tools — brush, eraser, magic wand, colour picker on the generated result
  • Chart / Finished toggle — see the numbered grid or a preview of the ironed result
  • Click a colour to isolate it in the breakdown table
  • PDF export with cover page, materials list, and the full grid chart
  • Printable blank grids in common pegboard sizes

How it works

The quantizer runs in two passes: first every pixel is matched to the nearest colour in the selected brand palette using CIEDE2000 perceptual distance, then the palette is reduced by frequency to your target colour count, then a final dither pass runs against the reduced set. Matching against the real brand palette before reduction is what keeps skin tones and gradients from collapsing into mud.

Background detection combines alpha channel data with a multi-edge flood fill, with a sanity cap so it doesn't eat the subject when the background and foreground are close in tone.

All of it runs client-side in a Web Worker.

Guides

Tools

Free and Pro

Generating, editing, and printing patterns is free. A Pro plan lifts the size and colour ceilings for larger builds:

Free Pro
Max pattern width 64 beads 232 beads
Max colours 48 96
Saved patterns 20 Unlimited
High-resolution PNG / PDF export

See pricing for current plans.

Built with

Next.js · TypeScript · Tailwind CSS · image-q · Fusion Pixel 12 for CJK pixel typography · deployed on Cloudflare Workers

About this repository

This is the public home for Bitbead — issues, feedback, and colour data corrections are welcome here. The application source is not open source.

Found a wrong colour code? Open an issue — palette accuracy reports are genuinely useful and get fixed fast.

Links


Bitbead · 比特拼豆 · ビットビーズ

About

Free browser-based Perler / Hama / Artkal / MARD / COCO bead pattern generator — turn a photo into a printable chart with exact bead counts. Nothing is uploaded.

Topics

Resources

Stars

0 stars

Watchers

0 watching

Forks

Releases

Packages

Contributors

Languages