Installation

Get up and running with Rondel in under a minute.

Install

Install the package from GitHub:

npm install github:msalia/rondel

If your project uses TensorFlow.js for ML-based scanning, also install the peer dependency:

npm install @tensorflow/tfjs

Basic Usage

Just pass your text — Rondel auto-selects the optimal rings, segments, and error correction:

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

const code = encode("https://example.com");
const svg = renderSVG(code, { size: 400 });

The returned code includes the auto-detected configuration:

code.rings           // 6 (auto-selected)
code.segmentsPerRing // 48 (auto-selected)
code.eccBytes        // 4 (auto-selected, fills remaining capacity)

You can also pin any parameter and let the rest auto-size:

const code = encode("Hello!", { eccBytes: 8 });
// rings and segmentsPerRing are auto-selected

Configuration Options

All options are optional. When omitted, the encoder auto-sizes for the smallest code with optimal error correction.

Tip: For most use cases, just call encode(text) with no options. The auto-sizer picks the smallest code with the most error correction.

Decode

To decode a bit array back to the original text, pass the same eccBytes:

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

const code = encode("Test");
const text = decode(code.bits, code.eccBytes);
console.log(text); // "Test"

Auto-Size Without Encoding

To preview the configuration without encoding:

import { autoSize } from "@msalia/rondel";

const result = autoSize("https://example.com");
// { rings: 6, segmentsPerRing: 48, eccBytes: 4, capacityBits: 160, usedBits: 160 }

Next Steps

• Learn about encoding modes — numeric, alphanumeric, and byte
• Customize output with SVG and Canvas rendering
• Understand Reed-Solomon error correction
• Add camera scanning with React hooks
• See benchmarks — 297 fps decode, 773 tests