Catch the file problems that break a logo before you send it to a client — in your browser, in a second.
A logo looks fine on your screen and still arrives broken. The text isn't outlined, so it reflows to Times New Roman on a machine that doesn't have your font. A raster image is hiding inside the "vector" file. There's no viewBox, so it scales unpredictably. The export is 200 KB of Illustrator cruft. You find out when the client does.
logo-preflight is a linter for logo SVGs. Drop one — or a whole batch — and it tells you what's wrong and how to fix it.
| Check | Why it matters |
|---|---|
| Outlined text | Live <text> reflows or vanishes without the exact font installed |
| Embedded raster | A pixel image inside a "vector" logo isn't scalable and bloats the file |
| viewBox | Missing or malformed viewBox makes the logo scale unpredictably |
| External dependencies | @import fonts and http:// references break offline and on the client's server |
| Editor cruft | Metadata, layer names, and export comments bloat the file for no visual gain |
| Coordinate precision | Ten-decimal path data is invisible to the eye and doubles the file size |
| File size | A heavy logo usually means a hidden image or an unoptimised export |
Each finding comes with a plain-language explanation and the concrete fix (the exact Illustrator / Figma menu, or the optimiser to run). Passing checks collapse out of the way so the problems stay in front of you. A batch sorts worst-first.
In the browser — studioalmae.com/logo-preflight. Drop your SVGs, read the report. Nothing is uploaded.
Locally:
npm install
npm test # 14 tests covering every check and its edge cases
npm run build:browser # bundles the standalone UI and the embeddable widget into dist/Then open web/index.html through any static server.
Embed it — dist/embed.min.js mounts the tool into a shadow root on any page:
<div data-logo-preflight></div>
<script src="dist/embed.min.js"></script>The shadow root isolates the tool from the host page's CSS in both directions, so it looks the same wherever it lands.
The whole engine (src/core/checks.ts) is dependency-free string analysis — no DOM, no upload, no server. Every check is a pure function with one rule: no false positives. A check either fires on something genuinely wrong or stays quiet, because a designer who gets warned about a non-problem stops trusting the tool. Previews render through <img>, never innerHTML, so an SVG carrying a <script> can't run.
A tiny bundle. Runs entirely on your machine.
An open-source tool by Studio Almae, a strategic branding studio for lifestyle brands, built for our own delivery workflow and opened up for anyone who ships logos.
MIT © 2026 Studio Almae