I built a private ingredient-label reader for my cousin with open-source OCR

Samuel — Fri, 02 Oct 2026 11:15:51 +0000

This is a submission for the Hacktoberfest Weekend Challenge: Build for a Friend.

What I Built

At the grocery store, an ingredient label is a tiny block of text that can matter a lot. My cousin has to pay close attention to food labels, so I built LabelKind as a second pair of eyes: choose what you want to check, take a photo of a packaged-food label, and review any possible matches.

I didn't want to make another app that points a camera at a meal and guesses what is in it. A photo can't show every ingredient, sauce, or cross-contact risk. LabelKind reads the printed ingredient list instead, shows the exact terms it matched, and leaves the decision with the person holding the package.

The avoid list starts empty. Your choices live only for the current browser session; I did not put my cousin's profile into the app or the repo.

Demo

Try the live demo

Choose Try a sample to see the matching flow without using a personal food label. Or scan a clear package photo or paste the ingredient text.

Code

View the source on GitHub

How I Built It

LabelKind is a React app built with Vite. For a label photo, Tesseract.js runs Tesseract's open-source LSTM neural-network OCR engine in the browser through WebAssembly. That OCR model is the AI at the center of the photo-to-text step.

After OCR, a small matching layer checks the recognized words against the terms the person selected. This part is deliberately transparent: it displays the matching words, distinguishes allergy terms from intolerance terms, and lets the user edit the OCR text. If the photo is hard to read, the ingredient list can be pasted instead.

Why Does Open Innovation Matter?

Food and health information is personal. Running open-source OCR in the browser lets LabelKind read a label without uploading the photo to a closed AI API. There is no account or server-side profile, and the model and matching behavior can be inspected and changed. I could make this without paying per scan or sending a photo to a vendor to get words back.

There is a trade-off: the first scan needs an internet connection to download the OCR worker, WebAssembly runtime, and English language data. The photo is processed in the browser; the app does not send it to a model service.

What I Learned / Next Step

LabelKind is a screening aid, never a food-safety guarantee. OCR can miss small print or misread a word. It can't detect cross-contact, recipe changes, or undeclared ingredients. For severe allergies, people still need to check the original package and contact the manufacturer if anything is unclear.

After trying the demo, my cousin said he thought it was awesome. He also suggested a useful next step: let each person create a profile with the ingredients they want to avoid, then use that profile to check label text or receipts they provide. The current version doesn't have accounts or saved profiles. Adding persistent allergy data would require clear consent, strong data protection, and a delete control before I'd ship it.

Ai to get UI/ux

Samuel — Wed, 29 Mar 2023 11:49:16 +0000

Hello devs please is there any Ai that can generate UI/UX for an ecommerc website, am currently working on a personal project

DEV Community: Samuel