The Embedding Playground is an interactive, single-page web app that demonstrates how language models place words in a geometric space. Four modes: a color-mapped grid of cosine similarities between any words you choose; an animated visualization of analogy arithmetic such as king minus man plus woman approximately equals queen; a neighborhood walker that maps a word's nearest neighbors and lets you step through the space link by link; and a sense-disambiguation radial that puts a polysemous word like court at the center, shows its competing senses on spokes, and shifts the distribution live as you add context words. Built on a curated 755-word slice of Stanford NLP's GloVe 300-dimensional word embeddings, with every calculation running client-side in vanilla JavaScript. No backend, no analytics, no network calls after page load. Live at embeddings.awrylabs.com.

Live · Open tool

Embedding Playground

An interactive demonstration that meaning is geometry, and that "close in that geometry" is why rephrasing a prompt changes an AI's answer. Four modes: measure distances between any words, do arithmetic on meaning, walk through a word's neighborhood, and watch a polysemous word's competing senses shift live with context. Every calculation runs live in your browser on real GloVe word embeddings.

Vanilla HTML/CSS/JS GloVe 6B · 300d No build step No tracking
✦ Open the playground rhoekstr/embedding-playground Read the story →
embeddings.awrylabs.com · last commit 2026-06-29

Meaning, as geometry

The same step that turns man into king turns woman into queen. That parallel is the analogy — and it's why you can do arithmetic on words.

king man + woman queen king − man + the same step man king woman queen

Add the gendered offset to king and you land on (or very near) queen. Mode B animates this on the real 300-dimensional vectors: no hand-waving, just the nearest word to the result.

At a glance

Curated words 755 Slice of GloVe 6B's 400K-word vocabulary, six thematic clusters. Each word's true top-20 neighbors are precomputed from the full space.
Dimensions 300 Each word is a 300-dim float32 vector. Cosine similarity and analogy arithmetic compute live on every interaction.
Cosine in JS ~15 Lines for the whole cosine and analogy kernel. No math libraries, no framework, no build step. The page, its logic, and the packed vectors are three small static files.
Network calls 0 After page load, no analytics, no requests. Everything runs client-side; a refresh resets state.

Four modes, one geometry

Language models don't look words up. They place them in a geometric space where distance encodes how words behave. Four interactive modes make that geometry tangible.

Mode A
How close are these?
A color-mapped grid of cosine similarities between any words you choose. Jargon clusters densely: the reason phrasing a prompt one way rather than another changes what you get back.
Mode B
Word math
Subtracting builds a difference arrow; adding carries it to a new word. The result resolves to the nearest real word, with statistical ties shown honestly. doctor − man + woman lands in a designed dead heat between physician and nurse; the closeness is the lesson.
Mode C
What's near this word?
Map a word's neighborhood and walk the space link by link. Reveals how plant has its factory and botanical senses collapsed into a single point: the limitation that motivated today's contextual models.
Mode D
Which meaning wins?
A many-sense word like court sits at the center of a radial map: legal, royal, sports, and dating senses each on their own spoke at their true distance. Type context words and watch the distribution shift live: add wedding and the dating sense rushes in from the margins. A hand-made version of what contextual language models do automatically.

Honesty by design

The interface labels its own simplifications. Four small choices that keep the mental model honest while keeping the demo approachable.

Simplifications, flagged

Every 2D projection is labeled as a flattening of 300-dimensional math. The picture is a teaching aid, not the answer. Near-tie analogy results draw both candidate words with their cosine values, rather than pretending to a single winner.

Slice vs full vocabulary

Within-slice nearest neighbors are contrasted with the true neighbors from the full GloVe vocabulary, so slice-induced quirks don't read as properties of the underlying geometry.

Bias, descriptively

The tool shows how occupations project onto a he–she axis, framed as "learned from how words co-occur in human writing", not as a normative judgment.

The mental model is the point

Built as a hands-on teaching tool for a workplace AI-literacy series. Designed so the mental model, not the tool, is what you walk away with.

Vanilla JS, end to end

~1.4 MB of total page weight, most of which is the vocabulary itself, shipped at full float32 precision as a base64-packed Float32Array.

Stack
No frameworks, no build step
Plain HTML, CSS, and JavaScript across three static files (page, logic, and the packed vectors). Cosine similarity is the dot product of two normalized vectors. No React, no math libraries, no transpiler, no bundler, nothing to build.
Curation
Python preprocessing
Python + NumPy script filters the full 400K-word GloVe vocabulary to a six-cluster lexicon. Precomputes each word's true top-20 neighbors from the full space, validates the sense-anchor sets, and verifies every curated analogy resolves before it ships: 35 pre-baked scenarios across the four modes.
Browser
Live computation
Cosine similarity, analogy vector arithmetic, and PCA-via-power-iteration 2D projections all run client-side on every interaction. No backend, no API, no work cached server-side.
Offline
Single-file build
A second build target ships as one HTML file containing the vocabulary, code, and styles. Double-click to open in any browser, no internet required. Byte-for-byte the same tool.

Open it. Embed it. Run it offline.

Use it online

embeddings.awrylabs.com opens straight into Mode A. Designed for desktop widths 1100px+; functional at 1366×768. Evergreen Chrome / Edge / Firefox.

Embed it inline

No frame restrictions. Drop it into any page as an <iframe> for a live demo embedded in your own article or slides.

Embed snippet
<iframe src="https://embeddings.awrylabs.com"
        width="1100" height="700" loading="lazy"
        title="Embedding Playground"></iframe>
Single-file offline version

Download embedding-playground.html, one HTML file with the vocabulary, code, and styles bundled in. Double-click to open in any modern browser, no internet required.

Credits

Word vectors

GloVe, Pennington, Socher & Manning (2014), GloVe: Global Vectors for Word Representation, EMNLP. Released under the Open Data Commons PDDL. Available at nlp.stanford.edu/projects/glove.

Concept & direction

Robert Hoekstra (awryLabs), 2026. Built for a workplace AI-literacy series. Source under github.com/rhoekstr/embedding-playground.