The 36 AI Blocks in Our Open-Source Gallery - All Running in Your Browser Right Now

Open localmode.ai in Chrome or Edge — it lands on the /blocks gallery, where 36 installable blocks across 12 categories run live. Every one of them runs entirely in your browser tab. No backend server. No API key. No data leaves your device. Close the tab and the computation stops - there is nothing to shut down, no bill to reconcile, no logs on a server you do not control.

These are not toy demos. They are complete applications - with file upload, drag-and-drop, batch processing, export to CSV/JSON/SRT, real-time streaming, and persistent IndexedDB storage - built on the same @localmode packages you would use in production. Each block is also a registry item: npx shadcn add @localmode/ui/blocks/<category>/<block> copies the whole thing into your project, and you own the code.

This post is a guided tour through all 36 blocks, organized by the category they live in. Each entry says what the block does, which models power it, and how much it downloads.

1. Chat

The flagship category, and the only one that stays a single flat block.

1.1 Chat

A full chat interface with streaming responses, conversation persistence, a semantic response cache, reasoning display, and vision support (attach an image and ask about it). What makes it unusual is the model selector: it surfaces 76 curated models from four inference backends — WebLLM (32 MLC models), Transformers.js v4 (16 ONNX models), wllama (25 GGUF models), and LiteRT (3 .litertlm models) — all behind the same LanguageModel interface. You can also paste a custom GGUF URL, and agent mode turns on tool calling. Nothing downloads until you pick a model.

Models: 76 curated across four backends (Llama 3.2, Qwen 3, Phi 3.5, Mistral, DeepSeek R1, Gemma 4, and more), plus Xenova/bge-small-en-v1.5 for the semantic cache | Download: ~120 MB -- 5 GB | Try Chat

2. Knowledge

Four blocks over one shared knowledge-base engine. Semantic Search and RAG Chat can each swap between the core engine and a LangChain implementation of the same contract, and return equivalent results.

2.1 Semantic Search

Build a searchable knowledge base in the browser. Add content three ways — paste text, upload PDFs, or scan images with OCR — then search by meaning rather than exact keywords. A cross-encoder reranker re-scores the top candidates for precision, and thresholds can be calibrated against your own corpus instead of guessed.

Models: Xenova/bge-small-en-v1.5 or Xenova/all-MiniLM-L6-v2 (embeddings); Xenova/bge-reranker-base or Xenova/ms-marco-MiniLM-L-6-v2 (rerank); Xenova/trocr-small-printed, onnx-community/GLM-OCR-ONNX, onnx-community/LightOnOCR-2-1B-ONNX (OCR ingest) | Download: ~34 MB -- 700 MB | Try Semantic Search

2.2 Document QA

Ask questions about your own documents and get direct answers pulled straight from the text, with a confidence tier attached. It also answers questions about an uploaded image — an invoice or a scanned page — using a document-visual-QA model rather than OCR plus search.

Models: Xenova/distilbert-base-cased-distilled-squad (extractive QA), Xenova/donut-base-finetuned-docvqa (document/invoice QA), Xenova/bge-small-en-v1.5 | Download: ~34 MB -- 800 MB | Try Document QA

2.3 RAG Chat

Chat with your own documents and get answers grounded in what you added. Paste text or drop in PDFs, ask a question, and watch the reply stream in. Each answer carries inline [n] citations that link back to the exact source and page, so you can check the facts.

Models: Xenova/bge-small-en-v1.5 (retrieval) + onnx-community/granite-4.0-350m-ONNX-web (generation) | Download: ~34 MB -- 250 MB | Try RAG Chat

2.4 Vector Data Manager

Manage the data behind the knowledge base. Import vectors from Pinecone, ChromaDB, CSV, or JSONL, preview the parsed records, then export back out to JSON, CSV, or JSONL. Watch storage use, detect embedding drift when your model changes, and re-index.

Models: Xenova/bge-small-en-v1.5 or Xenova/all-MiniLM-L6-v2 (re-embedding on import) | Download: ~34 MB | Try Vector Data Manager

3. Vision

3.1 Object Detector

Find and label objects in a photo, drawing a colored box around each with its name and confidence. Feed it an uploaded image, the built-in sample, or a still from your webcam. A separate live camera mode runs a real-time face-detection loop and reports a running face count.

Models: Xenova/detr-resnet-50 (detection) + MediaPipe BlazeFace (live loop) | Download: ~1 MB -- 170 MB | Try Object Detector

3.2 Live Tracker

Track your body in real time through the webcam across four modes: hand skeletons (21 points), full-body pose (33 points), a detailed face mesh (478 points, with expression blendshapes), and hand-gesture recognition (8 gestures). Landmarks are drawn on the video with a live frame rate, and switching modes disposes the previous tracker.

Models: MediaPipe hand / pose / face landmarker + gesture recognizer task bundles | Download: ~4 MB -- 15 MB | Try Live Tracker

4. Audio

Six blocks, from recorded transcription through live streaming speech to text-to-speech.

4.1 Voice Notes

Record or upload audio and get a transcript back. Save transcripts as notes, replay them word by word in sync with the audio, and search your notes by meaning rather than keyword.

Models: Xenova/whisper-tiny.en or onnx-community/moonshine-tiny-ONNX / moonshine-base-ONNX (STT) + Xenova/bge-small-en-v1.5 (note search) | Download: ~34 MB -- 237 MB | Try Voice Notes

4.2 Live Transcription

Turn on your microphone and watch speech become text in real time, gated by voice-activity detection so silence does not burn inference. It also ships a hands-free assistant that listens, thinks, and speaks back, with barge-in so you can interrupt mid-sentence. Stopping releases the microphone.

Models: Xenova/whisper-tiny.en / moonshine-* (streaming STT), onnx-community/silero-vad (VAD), onnx-community/granite-4.0-350m-ONNX-web (assistant), onnx-community/Kokoro-82M-v1.0-ONNX (speech) | Download: ~2 MB -- 237 MB | Try Live Transcription

4.3 Meeting Assistant

Upload meeting audio or paste a transcript, then get a short summary and a checklist of action items with priorities. Tick items off, track progress, and export everything to a text file. It is a three-step pipeline — transcribe, summarize, extract — and cancelling mid-summary preserves the completed transcript.

Models: Xenova/whisper-tiny.en / moonshine-* (STT) → Xenova/distilbart-cnn-6-6 (summary) → onnx-community/granite-4.0-350m-ONNX-web (action items) | Download: ~40 MB -- 237 MB | Try Meeting Assistant

4.4 Voice Explorer

Browse and preview 29 text-to-speech voices grouped by language. Type any text, hear each voice read it, and play two side by side to compare.

Model: onnx-community/Kokoro-82M-v1.0-ONNX (29 English voices) | Download: ~86 MB | Try Voice Explorer

4.5 Audiobook Reader

Paste long text and have it read aloud, with playback starting before synthesis finishes. Adjust reading speed, pause, resume, or stop anytime, and download the result as a WAV file.

Model: onnx-community/Kokoro-82M-v1.0-ONNX (streaming TTS, up to 10,000 characters) | Download: ~86 MB | Try Audiobook Reader

4.6 Audio Classifier

Record a sound or upload an audio file and see what it is, from music and speech to everyday noises. Results come back as a ranked list of the most likely sounds, top guess highlighted.

Model: MediaPipe YAMNet (521 categories) | Download: ~15 MB | Try Audio Classifier

5. Text

5.1 Language Detector

Detect what language a text is written in as you type, showing the most likely candidates with a confidence for each. Paste two texts and see how close they are in meaning, scored by cosine similarity over on-device text embeddings.

Models: MediaPipe language detector (110 languages) + MediaPipe text embedder (Universal Sentence Encoder) | Download: ~7 MB | Try Language Detector

6. Device

Three blocks that download nothing. They inspect the browser, the hardware, and remote model metadata.

6.1 Device Report

See what your device and browser can do for on-device AI. It checks hardware, browser features (WebGPU, WASM threads, cross-origin isolation), and free storage, then tells you whether a small model will actually run here — and what batch size suits it.

Models: none — browser capability detection only | Download: No download | Try Device Report

6.2 Model Advisor

Find the best on-device model for a task on your hardware. Pick from 21 task categories to get a ranked list of models that fit your device, compare any two side by side, and register your own model into the registry.

Models: none — reads the curated model registry | Download: No download | Try Model Advisor

6.3 GGUF Explorer

Search over 160,000 GGUF models on HuggingFace and peek inside any file to see its architecture, quantization, context length, and whether it will run in your browser. It reads roughly 4 KB via an HTTP Range request rather than downloading the model. Found one you like? Send it straight to the chat block.

Models: none — ~4 KB Range-read of GGUF metadata headers | Download: No download | Try GGUF Explorer

7. Agents

Both blocks run their own WebLLM model and require WebGPU. They share a default model, so the browser cache is shared between them.

7.1 Research Agent

An agent that answers a question by using tools step by step — searching a bundled corpus, taking notes, running calculations — with a ReAct loop rendered as an expandable step timeline. It pauses for your approval before each tool runs, and a denial is fed back into the loop as the step's observation, so you stay in control. Every decision leaves an immutable receipt.

Models: WebLLM, default Qwen3-1.7B-q4f16_1-MLC, up to Llama 3.1 8B (WebGPU required) | Download: 1.1 GB -- 5 GB | Try Research Agent

7.2 Data Extractor

Pull structured JSON out of free text using five ready-made Zod templates, with automatic retry and self-correction when the output does not validate. The result renders as a sortable table and a chart built from the numbers it actually found.

Models: WebLLM, default Qwen3-1.7B-q4f16_1-MLC, up to Llama 3.1 8B (WebGPU required) | Download: 1.1 GB -- 5 GB | Try Data Extractor

8. Writing Tools

The provider-fallback reference. Three of these four resolve Chrome's built-in AI per capability when it is actually available, and fall back to Transformers.js behind an explicit download gate. A badge reports which provider actually resolved.

8.1 Write

Rewrite or improve a draft with an AI edit you review as a before/after diff, then accept or reject it. Use quick presets or write your own instructions, with a live word count.

Models: Chrome AI Prompt API, falling back to onnx-community/Llama-3.2-1B-Instruct-ONNX | Download: Chrome AI or ~380 MB | Try Write

8.2 Translate

Translate between 24 directed language pairs (12 languages, each paired bidirectionally with English), swap the direction with one click to carry the result back into the input, and copy or clear as you go. Fully offline once the pair's model is cached.

Models: Chrome AI Translator API, falling back to Xenova/opus-mt-{src}-{tgt} | Download: Chrome AI or ~80 MB per pair | Try Translate

8.3 Summarize

Turn long text into a shorter summary, choosing a short, medium, or long length and either an extractive (pulled from the text) or abstractive (reworded) style. See the compression ratio and the reading time saved.

Models: Chrome AI Summarizer API, falling back to Xenova/distilbart-cnn-6-6 | Download: Chrome AI or ~120 MB | Try Summarize

8.4 Complete

Fill in a blank word in your sentence with the top five suggestions ranked by likelihood, then click one to apply it and keep going. This is the one Writing Tools block with no Chrome AI path — Chrome exposes no fill-mask API.

Model: onnx-community/ModernBERT-base-ONNX (fill-mask) | Download: ~150 MB | Try Complete

9. Text Insights

Four transformers-only blocks for classification and evaluation. Every model loads only behind an explicit Run.

9.1 Sentiment Analyzer

Score text as positive or negative, one message at a time or thousands at once. Watch live throughput and ETA, see running positive and negative totals, and browse results in a windowed list that stays responsive at scale.

Model: Xenova/distilbert-base-uncased-finetuned-sst-2-english | Download: ~67 MB | Try Sentiment Analyzer

9.2 Text Classifier

Zero-shot classification with your own labels. Define categories — "billing inquiry," "technical support," "feature request," "spam" — and the model routes text into them with no fine-tuning. Add or remove labels on the fly and see how every label ranked.

Model: Xenova/mobilebert-uncased-mnli (zero-shot) | Download: ~25 MB | Try Text Classifier

9.3 Model Evaluator

Measure how accurate a classifier is on a labeled set. Get accuracy plus macro precision, recall, and F1, a color-coded confusion matrix, the run duration, and one-click JSON export.

Models: Xenova/distilbert-base-uncased-finetuned-sst-2-english, Xenova/mobilebert-uncased-mnli | Download: ~67 MB -- 400 MB | Try Model Evaluator

9.4 Threshold Calibrator

Pick a similarity cutoff from your own examples instead of guessing. It shows the calibrated value beside the model's built-in preset, along with the distribution your scores actually formed.

Models: Xenova/all-MiniLM-L6-v2, Xenova/bge-small-en-v1.5 | Download: ~23 MB -- 33 MB | Try Threshold Calibrator

10. Photo

Four blocks over CLIP-family models. In each one, a single model powers both the embeddings and the zero-shot categorization — text and images land in the same vector space, which is what makes cross-modal search work at all. All four default to the same model, so the browser cache is shared.

10.1 Smart Gallery

Build a photo library in the browser that tags every image automatically as it loads, batching adaptively to your device. Browse as a grid or list with filename, category, confidence, and how many similar photos it found. Delete, clear, or cancel mid-ingest.

Models: Xenova/clip-vit-base-patch32 (default) or Xenova/siglip-base-patch16-224 | Download: ~350 MB | Try Smart Gallery

10.2 Image Search

Search a photo library by typing what you are looking for, or by dropping in a reference image. Both queries search the same vectors. Tune how many results to show and the minimum similarity a match must clear.

Models: Xenova/clip-vit-base-patch32 (default) or Xenova/siglip-base-patch16-224 | Download: ~350 MB | Try Image Search

10.3 Duplicate Finder

Find and group near-duplicate images with a union-find pass over the cached embeddings. Tune how close a match must be with Strict / Balanced / Relaxed presets, review each group, and bulk-delete while keeping the first. Changing the threshold re-groups without re-embedding.

Models: Xenova/clip-vit-base-patch32 (default) or Xenova/siglip-base-patch16-224 | Download: ~350 MB | Try Duplicate Finder

10.4 Photo Categorizer

Add photos to a library where each is sorted into a category as it loads. Edit the label set (Photo and Product presets ship built in), re-sort the whole library at once, and filter down to a single category.

Models: Xenova/clip-vit-base-patch32 (default) or Xenova/siglip-base-patch16-224 | Download: ~350 MB | Try Photo Categorizer

11. Image Studio

11.1 Background Remover

Remove the background from a photo and download a clean, transparent PNG. It segments the image, picks the highest-scoring mask, composites the subject onto transparent alpha, and shows the result beside the original on a checkerboard.

Model: Xenova/segformer-b0-finetuned-ade-512-512 (segmentation) | Download: ~15 MB | Try Background Remover

11.2 Image Enhancer

Upscale and sharpen photos. Choose a fast 2x mode, a higher-quality 4x mode, or a restore mode tuned for real-world low-quality images, then compare before and after and download the result. Each mode lazily loads its own model and keeps its own result.

Models: Xenova/swin2SR-lightweight-x2-64 (2x), Xenova/swin2SR-classical-sr-x4-64 (4x), Xenova/swin2SR-realworld-sr-x4-64-bsrgan-psnr (restore) | Download: ~45 MB per mode | Try Image Enhancer

11.3 Image Captioner

Automatically write short alt-text for any image. Drop in JPEG, PNG, WebP, or GIF files up to 10 MB and captions accumulate in a gallery you can copy from, remove single items from, or clear all at once.

Model: Xenova/vit-gpt2-image-captioning | Download: ~230 MB | Try Image Captioner

12. Privacy

12.1 PII Redactor

Find and hide personal details in text — names, emails, phone numbers, card numbers. On-device named-entity recognition finds them, a regex pass catches the structured formats, and each type can be toggled independently before you copy or export the cleaned text. A second panel demonstrates differential privacy: noise is added to embeddings under a tracked privacy budget, and a badge reports when it was actually applied.

Models: Xenova/bert-base-NER (entity detection) + Xenova/all-MiniLM-L6-v2 (differential-privacy demo) | Download: ~23 MB -- 110 MB | Try PII Redactor

12.2 Encrypted Vault

Keep private notes and documents in a vault locked by a passphrase you choose. Everything is encrypted with AES-GCM before it is saved, decrypted only when you view it, and stays locked across a reload — the derived key lives in memory only and is never persisted. A tamper-evident, hash-chained audit log records every action, and you can verify the chain in the UI or export it as JSONL.

Models: none — Web Crypto and IndexedDB only | Download: No download | Try Encrypted Vault

What Ties It All Together

Every one of these 36 blocks is built on the same stack:

• @localmode/core provides the zero-dependency runtime: embed(), classify(), generateText(), generateObject(), createVectorDB(), createAgent(), runAgent(), encrypt(), evaluateModel(), recommendModels(), and dozens more functions. No external dependencies.
• @localmode/transformers wraps HuggingFace Transformers.js v4 with 26 model factories (embeddings, classification, NER, translation, summarization, vision, audio, OCR, and more).
• @localmode/webllm provides WebGPU-accelerated LLM inference with 32 curated chat models from Llama, Qwen, Phi, Mistral, and DeepSeek.
• @localmode/wllama runs any GGUF model via llama.cpp compiled to WebAssembly - 180,000+ models, universal browser support, no WebGPU required.
• @localmode/react provides 64 React hooks that manage loading states, cancellation, error handling, and streaming for every operation.
• @localmode/langchain adapts local models to LangChain.js interfaces, and implements the same knowledge-base engine contract as core - which is why the Knowledge blocks can toggle between them and get equivalent results.
• @localmode/pdfjs, @localmode/chrome-ai, @localmode/devtools, @localmode/litert, @localmode/mediapipe, @localmode/ai-sdk, @localmode/dexie, @localmode/idb, and @localmode/localforage round out the ecosystem with PDF extraction, Chrome Built-in AI, observability, on-device LiteRT inference, MediaPipe vision/audio tasks, Vercel AI SDK integration, and storage adapters.

The blocks gallery itself is a Next.js 16 application with React 19 and shadcn/ui. It is simultaneously a shadcn registry endpoint — the blocks compose 100+ copy-owned UI primitives across 10 families, and both are installable with the shadcn CLI.

The Models Behind the Gallery

Every model, and which blocks load it. Sizes are listed per block above, because most blocks offer a choice of model.

Every model is downloaded once from HuggingFace and cached in the browser's Cache API. Subsequent visits load from disk in seconds. Four blocks — Device Report, Model Advisor, GGUF Explorer, and Encrypted Vault — never download a model at all.

Running It Yourself

Everything is open source and lives in the blocks gallery. To run it locally:

git clone https://github.com/LocalMode-AI/LocalMode.git
cd localmode
pnpm install
pnpm --filter ui dev

Open http://localhost:3000/blocks and every feature is available locally. You can also read the source of any block at apps/ui/src/app/blocks/{category}/{block}/ - each one is a single self-contained file with zero local sibling imports, so the version you read is the version shadcn add copies into your project.

Methodology

All block names, routes, counts, and model IDs were verified against the block sources under apps/ui/src/app/blocks/ (36 route-served blocks across 12 categories, read 2026-07-09) and the gallery card model in apps/ui/src/app/blocks/blocks-catalog.ts, whose download badges are grounded in each block's real model constants. Per-block download figures are those badges. Package count was verified against the packages/ directory (15). React hook count was verified against packages/react/src/index.ts (64). Transformers model-factory count was verified against packages/transformers/src/provider.ts (26). WebLLM and Transformers.js LLM catalog counts were verified against packages/webllm/src/models.ts (32) and packages/transformers/src/models.ts (16). The 24 directed translation pairs were verified against the LANGUAGES list in the Translate block (12 non-English languages, each bidirectional with English). The GGUF model count was verified against huggingface.co/models?library=gguf (180,000+ as of May 2026).

Sources

• LocalMode blocks source (apps/ui/src/app/blocks) -- ground truth for the block implementations and feature list
• LocalMode documentation -- full API reference for all packages
• @localmode/ui registry -- the UI primitives the blocks compose, and how to install them
• HuggingFace GGUF models filter -- live count of GGUF models (180,000+ as of May 2026)
• Xenova/detr-resnet-50 model card -- object detection model used in Object Detector
• Xenova/donut-base-finetuned-docvqa model card -- document visual QA model used in Document QA
• onnx-community/moonshine-base-ONNX file tree -- ONNX file sizes for Moonshine Base
• Transformers.js documentation -- browser ML inference library
• WebLLM project -- WebGPU LLM inference engine
• MediaPipe Tasks -- the vision, audio, and text task bundles
• Chrome Built-in AI -- Gemini Nano APIs in Chrome