Last verified:
A logo is one window into your brand — not the whole frame. Drop yours in; Brand Suite extracts a palette, grades every pair against WCAG, and hands you CSS tokens and a starter README. Built in the browser, by the studio. Your pixels never touch a server.
Stays in your browser. See how we verified itFrom Muntin Digital — a one-person restaurant web studio in Silver Spring, MD. The window in.
Not sure what to upload?
var(--cream))var(--ink))Click any chip to copy its hex to your clipboard. Roles are assigned by chromatic intent — the most saturated color anchors Primary, not the most abundant pixel.
This logo reads as monochromatic. The roles below label the lightness extremes; treat them as a starter, not a system.
This image has very subtle colour variation — the extracted palette may not represent a brand system. Try the Workshop to refine, or upload a flat-colour logo.
One color dominates everything else — the wall behind your menu chalkboard, the background of your Instagram grid, the cream stock of your menu. Use the Neutral chip (or whichever of the two largest clusters is lightest) here. Restraint at this layer is what makes the rest readable.
The one color you want a diner’s eye to land on first — the “Reserve a table” button, your storefront awning, the eyebrow on a menu header. Use Primary. Each accessible-pair value in the export tells you what text color to put on top so it actually reads.
Accent 1, Accent 2, and Secondary are for dividers, pricing, sub-headlines, hover states — one decision at a time. A page that uses all five colors at full strength reads as five different brands. More on palette discipline →
Five hex codes (or fewer — leave blanks where you don’t have one yet). Each input shows a live swatch as you type. The palette commits when you click Apply — you’ll go straight to the contrast grid and exports.
Three small choices — mood, ground, and how many colours — then pick the candidate palette that feels like your restaurant. The math (hue distance, WCAG contrast, OKLab gamut) runs as you click.
A handful of restaurant-typical anchors to choose from. Hover any tile to see what it’s often used for. None of these your style? Type a hex code at the bottom.
Warm spice & earth
Forest & deep
Navy & ink
Vibrant & expressive
The anchor is the colour that anchors your brand — what your menu, signage, Instagram avatar, and the Workshop’s candidates will all relate to. Pick the one closest to what you want; the Workshop will help you place it.
Mood maps to a colour-theory family. Analogous palettes use neighbouring hues (15–30° apart) and feel quiet. Complementary palettes use opposite hues (180° apart) and feel energetic. The math runs in OKLab — the same colour space your eyes use to judge similarity, not the same one your screen lives in.
The ground is the surface 80% of your design lives on — the menu paper, the website background, the Instagram grid base. Your hero colour and accents need to read against it without effort. The math we run guarantees every accent meets WCAG AA contrast (4.5:1) against your chosen ground.
Most restaurant brands use 3–5 colours total. Fewer feels stark; more makes design decisions harder. Pick the smallest set that still gives you what you need.
Osteria Giardino · Silver Spring
Our menu shifts with what the farms bring us each week. Dinner service starts at 5 PM; reservations recommended Thursday through Sunday.
Reserve a tableTue–Sun, 5–10 PM · 912 Main St, Silver Spring, MD
Read pair-wise: each cell is text-on-color contrast for that pair. Diagonal duplicates omitted. Hover any cell for plain-English guidance — "Body text OK" means use it freely; "Headlines only" means use it for big type but not paragraphs; "Don't use" means readers will struggle.
Body text OK
Headlines only
Don't use
Show the WCAG technical thresholds
Ratios of 7+ clear AAA (normal text). 4.5+ clears AA. 3+ clears AA for large text only (18pt+ or 14pt bold). Below 3 fails for body copy. The simulation toggle re-renders the grid through Brettel/Viénot dichromacy projections — perceptual preview, not a clinical test.
The Muntin Pane is a 1200×1260 PNG arranging your logo, palette, type sample, and menu preview into the same 2×2 grid as our brand mark — one shareable file you can email to a designer, post to Instagram, or print. The ZIP includes the Pane plus palette.css, tokens.json, and a README.md naming each color's role. Everything is composed and packaged in your browser — no upload.
Five color-shifted versions of your uploaded logo. Each is a transparent PNG at 2× your source resolution — drop them on light or dark backgrounds, print them at any size. Generated in your browser; the logo never leaves the device.
Best results with PNG or SVG logos that already have a transparent background. JPEG logos will render with their original background pixels intact (the recolor only touches non-transparent pixels).
Four ready-to-use canvases dressed in your palette. Drop your logo on, hand to a printer, post to Instagram, or staple to the door. Generated in your browser at print-grade resolution.
Save this palette to the Workshop so it follows you across devices.
Sign in to saveIt is not a logo generator, a finished brand identity, or a typography recommendation. More on the limits below.
A logo in progress is sensitive: it might be a rebrand you haven't announced, a concept you haven't shown a partner, a finished mark you paid real money for. Nine claims. Each is verifiable in your own browser in under a minute. If any of them turn out to be wrong, we want you to find out first.
No fetch(), XMLHttpRequest, FormData, or form submit fires when you drop a file. The browser reads the pixels via URL.createObjectURL() and paints them onto a canvas — everything after that is client-side.
The only endpoint this page uses is GET /tools/brand-suite/. No /api/brand-suite-upload, no /api/extract-palette, no logger. The Worker can't hear you.
curl -X POST https://muntin.digital/tools/brand-suite/. Response: 405 Method Not Allowed (or similar) — there's nothing listening for POSTs.Plausible receives properties from a short, fixed list of enumerated values. A 1.3 MB PNG becomes file_type: "png" + size_bucket: "500kb-2mb". A teal logo becomes primary_hue: "teal". Your raw hex values, filename, and bytes are never a value on any event.
plausible. Drop a logo; extract a palette. When the event fires, look at its payload. Values like primary_hue: "teal" — never primary_hex: "#1F4E5B", never filename: "client-draft-v7.png".The pixel array and the extracted palette live only in JavaScript variables, which disappear when you close the tab. There's no persistent state for the tool.
This page loads three same-origin JavaScript files: site-wide site.js (nav + language switch), tool-specific brand-suite.js (math + UI), and brand-worker.js (the Web Worker that runs k-means off the UI thread). Plus one analytics script (Plausible) that receives the bucket values. Nothing else — no Google Tag Manager, no Meta Pixel, no chat widget, no session replay, no CDN-fetched dependencies. The ZIP writer is inline in this page's JavaScript; it isn't a third-party library.
plausible.io/js/…, site.js, brand-suite.js, and brand-worker.js. That's it.This page sets <meta name="referrer" content="no-referrer">. When you click a link out of Brand Suite (to the glossary, to a blog post, to the services page), the destination never sees the URL you came from — so even if we added a "save this palette" share link later (encoded in the URL fragment), no third party could harvest it via the Referer header.
<meta name="referrer" content="no-referrer"> in the <head>. Click any outbound link; confirm the destination's Referer request header is absent.No build step, no minification, no framework. The math module is plain JavaScript — you can read every line, including the 50-line ZIP writer we inlined instead of pulling in a 100 KB dependency.
/tools/brand-suite/brand-suite.js directly. Search for function extractPalette — that's the whole k-means, in the open. Search for buildZipBlob in this page's <script> — that's the ZIP writer.Close the tab, reopen the tool: the upload zone is empty, the palette strip is blank, the contrast grid is hidden. There's no account, no saved history, no "welcome back, here's your last logo."
/tools/brand-suite/. Every surface is back to its starting state.Clustering runs in brand-worker.js — a Web Worker loaded from the same origin. Its only inputs are the pixel array we pass via postMessage and the k value. It imports only ./brand-suite.js (same origin), and our code never hands it a fetch, a socket, or any network primitive. The worker dies when the tab closes.
/tools/brand-suite/brand-worker.js directly. The whole file is under 60 lines — count the fetches, XHRs, and WebSockets. You'll find zero.Five tests you can run on any free creative tool — palette extractor, logo resizer, brand-mood generator, favicon builder — before you upload a work-in-progress mark. We score ourselves alongside a typical lead-generation free tool so the difference is concrete, not rhetorical.
| The test | Brand Suite | Typical free tool |
|---|---|---|
| 1. Does uploading a file trigger a network request?Open DevTools → Network. Drop a file. | No requests fire. | The file POSTs to a server the moment you drop it. |
| 2. Is the privacy claim at the point of upload?Not buried in a policy page. | "Stays in your browser" badge next to the dropzone, full 9-step panel in-page. | Privacy Policy link in footer only; implicit consent on submit. |
| 3. Is there an account / newsletter / cookie gate?Anything demanding "accept all" before you can use the tool. | Nothing — no gate, no popup, no cookie banner. | "Enter your email to unlock your palette." |
| 4. Any third-party analytics, session replay, marketing scripts?DevTools → Network → filter JS. | Privacy-first Plausible only; bucket props (never hex values, never filenames). | Google Analytics, Meta Pixel, HubSpot, session replay — stacked. |
| 5. Is the source code readable?Right-click → View Source. | Unminified, under ~600 lines, every math function + the ZIP writer named. | Minified SaaS bundle; math hidden inside a framework dashboard. |
Apply the same five tests to any creative-workflow tool that asks for an upload — logos, photos, invoices, contracts, ID scans. A tool that silently POSTs your file is storing it. A tool with no in-page privacy claim is dodging the question. You're allowed to walk away before you drag anything in.
Not every asset belongs in every conversation. A logo in progress is mid-tier — more sensitive than a public menu, less sensitive than a tax ID, but routinely handed over to free tools as if it were Tier 1. Four tiers, each with a different audience and a different level of caution. Your brand assets usually live in Tiers 1–2.
Everything anyone can find on your site, your listing, or a walk-by — including any logo already in the wild.
Share with: Anyone. Optimize aggressively — this is how customers find you.
Legal to share, but useful to a rival — or leverage for a platform. Most in-progress brand work lives here.
Share with: Designer, bookkeeper, consultant, broker — under NDA. Not platforms, not competitors, not "free tools" that keep your upload.
Your actual operating numbers, customer pipeline, employee details.
Share with: Inside the business only. POS vendor, payroll processor, accountant — and only under a written contract that specifies what they can and can't do with it.
Legally protected. Losing this has fines, lawsuits, or criminal exposure attached.
Handle with: Encrypted storage, access logging, contracts with cybersecurity terms. Never email. Never in a shared spreadsheet. If a vendor asks for this casually, that alone is a flag.
Apply this anywhere you're asked to hand data over — vendor evaluations, contracts, loan applications, "free audit" intakes. The pattern: data never flows up a tier. A Tier 3 vendor doesn't get Tier 4 access just because they asked. A Tier 1 audience (a platform, a listing site, a competitor) doesn't get Tier 2. The easiest way to reduce your attack surface is to stop volunteering data that wasn't actually required.
Brand Suite is a starter kit — it extracts colors from a logo you already like and grades the accessibility math. It doesn't build the brand. These limits are load-bearing, not decorative: a free tool that quietly claimed otherwise would waste your time and undercut our studio's actual work.
Brand Suite reads a logo you already have. It will not draw a new mark, fix a kerning issue, or turn a phone photo of your sign into a vector. If you don't have a logo you're happy with yet, the palette extraction will reflect that — garbage in, garbage out.
A finished identity needs a one-color version for embroidery, foil, and small-scale print — and often an inverted variant for dark-ground layouts. Brand Suite doesn't produce those in v1. A designer does it properly.
The preview uses our site's fonts for context, not a recommendation. Typography pairing is the second-biggest tone carrier after color; guessing at it algorithmically produces results that all look the same. Curated work, not a heuristic.
The README in the ZIP names each color's role and its accessible pairs. It doesn't cover clearspace, minimum sizes, misuse examples, voice, photography direction, or the other chapters of a real style guide. Those are what the paid identity service delivers.
The live-preview block shows the palette applied to one sample card. It's a legibility check, not a portfolio piece. Business cards, menu covers, Instagram grids, storefront signage — those are design projects, not one-click exports.
What this is: a starter kit to think with.
Three audiences, three handoffs, one free tool. Bring the Muntin Pane to a designer — it shows your palette in context on a single page. Bring the CSS variables to a developer — they paste straight into a stylesheet. Bring the hex codes to a printer or signmaker — that's the language of every print spec sheet. The Pane is the file a non-technical reader can actually share; the rest is for the people building things for you.
When you want a finished identity, hire a designer.
A Brand Identity engagement covers the concept work, the usage rules, the variants, the typography, and a deliverables package you can hand to any vendor. Bring the Muntin Pane, the palette, and the tokens you generated here — that's 30 minutes of the engagement already done.
See Brand Identity (from \$1.5k)Every check this tool runs maps to a specific concept in the Library. Two starting points — one definition, one playbook.
the full visible system around your logo
The full visible system that carries a business across every touchpoint — logo, colors, typography, voice, and the rules for using them. A l…
Read the definition Glossarythe curated set of colors that belong to your brand
The curated set of colors that belong to a brand — typically a primary, a secondary, a small number of accents, and a couple of neutrals. Ea…
Read the definition Glossarya brand color, nudged until text on it clears WCAG AA
A version of a brand color whose lightness has been shifted just far enough — preserving hue and feel — that text rendered in it on a named …
Read the definition Glossarya name for a decision, not a value
A named reference for a brand decision — a color, a font size, a corner radius, a spacing step — exported as a portable file (CSS variables,…
Read the definitionWhat the designer needs to do the work — top 10 sellers, dogs to cut, price changes, callout items, dietary flags, print and digital and POS targets.
Open the sheetAsset type, file location, last updated, owner, license. Catches the logo that only exists on a former employee's laptop.
Open the sheet