Rondel

A circular barcode format with ML detection, perspective correction, and Reed-Solomon error correction.

$npm install github:msalia/rondel
DocumentationPlayground

Encode Anything

Text, URLs, data — auto-selects numeric, alphanumeric, or byte encoding for optimal density.

ML Detection

YOLOv8n-Pose model with 4-corner keypoints. Hough circle fallback when offline.

Error Resilient

Reed-Solomon over GF(256) corrects damaged bytes. Configurable from light to maximum protection.

React Ready

Camera scanning hook with multi-frame consensus. Tree-shakeable — import only what you need.

Quick Start

Just pass your text — rings, segments, and error correction are auto-selected:

typescript
import { encode, renderSVG } from "@msalia/rondel";

// Auto-sizes for the smallest code with optimal error correction
const code = encode("https://example.com");

const svg = renderSVG(code, {
  size: 400,
  primary: "#1a237e",
  secondary: "#c5cae9",
});

Scan from Camera

tsx
import { useCircularScanner } from "@msalia/rondel";

function Scanner() {
  const { videoRef, result } = useCircularScanner({
    rings: 5, segmentsPerRing: 48, eccBytes: 16,
    modelUrl: "/models/circular_code/model.json",
  });

  return (
    <div>
      <video ref={videoRef} autoPlay playsInline />
      {result && <p>Found: {result.data}</p>}
    </div>
  );
}
Full installation guide →API reference →

Playground

Encode text and customize the output in real time.