Glyphfield documentation

Glyphfield is a free, open-source brand design studio released under the MIT License. It runs in the browser and stores your work in that browser. A brand identity in Glyphfield is one record of a brand's strategy, voice, logos, colors, typography, pictures and layout rules. Every tool in the Studio reads that record, so a change to a color or a typeface appears in every design that uses it. The Studio is the visual workspace at /studio.

Studio tools cover brand applications, moodboards, a brand book, animation, Lottie files, layered compositions with live shaders, color and type tokens, social images, code cards, partner lockups, blog covers, slides and interface components. Each tool keeps its work as a JSON source document and exports files that the browser renders. Coding agents can operate the same tools through the Browser API (window.glyphfield.studio). They can also generate templates, backgrounds and briefs through an HTTP API that keeps no state between requests.

One identity feeds every visual and programmatic surfaceLocal-first brand system

Starting points

01Build your first artifactCreate or duplicate a project, edit the identity, choose a tool and export a file.02Compose in Design LabLayer type, marks, images, stickers, live shaders and effects on artboards, then export PNG, JPG, GIF or MP4.03Create motionSequence scenes with keyframes, text entrances, transitions, live backgrounds and audio, then export GIF or MP4.04Set up the identityFill the identity by hand or with a coding agent, check its health score and download the brand kit.05Connect an agentChoose between HTTP generation, the Studio Browser API and the Markdown docs for an agent task.06Ship artifactsPick the right format among PNG, JPG, SVG, GIF, MP4, PDF, Lottie and JSON, and check the file before you use it.07Check paritySee the source document, Browser API actions, HTTP routes and export formats of every Studio tool.08Read the referenceLook up endpoints, Browser API methods, source formats, keyboard shortcuts, limits and licensing.

Connected systems

01Identity foundations

The identity holds strategy, art direction, logos, licensed assets, colors, typography, voice, applications and system defaults.

02Visual editors

Studio tools apply the identity to brand elements, moodboards, the brand book, Design Lab, Animation, Lottie, expression templates, tokens and components.

03Portable documents

Each tool exposes its exact JSON source. Design Lab and Animation also keep saved checkpoints, autosave recovery and layer history.

04Agent interfaces

Agents read versioned discovery routes, call deterministic HTTP generation, read processed Markdown and drive the Studio through the Browser API.

Studio screenshots

General Translation Design Lab composition — Design LabLayers · shaders · output

General Translation Animation sequence — AnimationFrames · timing · materials

Brand bookGenerated standards

General Translation Moodboard — MoodboardIdentity applications

Agent interfaces

The visual Studio and the agent interfaces read the same catalogs and validators.

/api/agent, /api/catalog, /api/labs, /api/materials, /api/identities and /api/elements publish the current capabilities.
POST /api/generate validates and runs template, background, element-brief and Design Lab sequence requests. /api/brand/validate checks an identity, and /api/brand/kit renders brand kit files.
window.glyphfield.studio operates the active Studio tool. It covers local files, exact source, Canvas, WebGL, GIF and MP4.
Every documentation page is available as processed Markdown at its URL with .md appended. Copy page at the top of each page copies that Markdown. The menu beside it offers View as Markdown, Open in GitHub, Open in ChatGPT, Open in Claude, Open in Cursor and Open in Scira AI.
/llms.txt is a short guide for agents. /llms-full.txt contains the complete documentation as one text file.

An agent reads the discovery routes first and then chooses HTTP generation or the Browser API. It applies the smallest source change that does the job and checks browser-rendered work visually. It reports success only after it confirms that the returned or downloaded file is not empty.

Local storage

Projects, saved designs, uploaded files, fonts and drafts stay in the current browser profile. The HTTP API processes each request in memory and cannot read or change a project stored in a browser. The API rejects remote asset URLs.

Operations and contribution

Back up editable work

Keep the identity, tool source, original assets and rendered proofs in files outside the browser.

Diagnose failures

Find whether a failure comes from source, storage, Canvas, WebGL, a codec or the download, without clearing the active project.

Host Glyphfield

Serve the docs, discovery, generation, OpenGraph and Studio routes from your own deployment.

Keep every interface aligned

Update the catalog, state, source, Browser API, HTTP API, docs, exports and tests in one change.

Links

Glyphfield's source code and original artwork are released under the MIT License. Bundled third-party marks, fonts, pictures and shader code keep their own licenses. Licensing lists each one and how to credit it.