Glossary Flashcards: An Image-to-Anki Deck Generator

Launch Live Demo (bring your own Anthropic API key)

The friction of manually creating flashcards often causes people to abandon flashcard based learning altogether. As a result, they miss out on the benefits of spaced repetition. I built this tool to remove that friction. Upload photos of a book’s glossary and get a clean CSV that can be imported directly into an existing Anki deck.

The code is on GitHub and a live version is available on Hugging Face Spaces.

How It Works

The earlier version of the web app ran locally with Tesseract. It was free and required no API keys. At the time, books were more likely to include dedicated glossary sections. Today, they often do not. Useful vocabulary now appears more frequently inline in bold text. Consider a sentence such as “Classification is a problem of assigning a label to an unlabeled example.” Only one of the three bold words is actually being defined. The others are cross references. Simple pattern matching was no longer sufficient. The current pipeline is straightforward. An Express backend receives the uploaded photo and sends it to Claude’s Vision API. It parses the JSON response, renders an editable table, and exports a CSV. The entire stack is about 300 lines of code.

Engineering Challenges

Most of the engineering was not in the JavaScript. It was in three other places.

The prompt did more work than the code. Explicitly telling the model to skip bold words that were merely referenced fixed almost every false positive in a single edit. Iterating on the prompt wording was the highest leverage work in the entire build.

The browser misreported file types. An uploaded WebP file arrived labeled as image/jpeg, which Claude’s API correctly rejected. The fix was to detect the true format from the first few bytes of the file, known as its “magic numbers,” and ignore the reported file type.

Anki has its own CSV grammar. The first export produced cards with every term and definition on the front and a blank back. A plain CSV does not tell Anki how to map columns to fields or which deck to create. The fix was learning that Anki reads ‘#header:value’ lines at the top of a CSV file. Adding five such lines turned the import into a single click.

These problems are worth noting. Each one lived in the gap between the documentation and what the system actually did when I ran it.

Deployment and Hosting

The app is now live on Hugging Face Spaces. Hosting it publicly was not possible before because every extraction requires a paid API call, and I did not want to share my own API key. Doing so would allow anyone to generate API charges on my account. I initially thought preventing that was out of scope, until I realized the app could simply ask each user to provide their own API key.

In short, users paste their own Anthropic API key into the app. It is used for that request and never stored. Each person pays only for their own usage, so there is no shared bill. The source is on GitHub, and the video above shows the app in action.