/brand · the identity system
A detector that refuses to look like the thing it detects.
slop-detect scores how generated a landing page looks. So the identity that ships it has to score zero on its own scan. Below is that identity, and the reasons it passes.
One drawn shape, one verdict dot.
The mark is a scan reticle: four viewfinder brackets around a single green dot, the verdict. It is the only drawn shape in the system. Anything else that looks like an icon is a Unicode glyph, because an icon font would itself trip the detector.
on paper · #F4F5F2
on ink · #16170FLowercase, hyphenated, monospace.
The wordmark is the mark plus the literal string set in JetBrains Mono, 700, tracking -0.01em. It is written the way you would type it into a terminal, because that is what it is: a command, not a brand name.
slop-detectFive colors. No purple anywhere.
Cool paper, near-black ink, and the three verdict hues. Green is clean, amber is mild, red is heavy. Color is never decoration here; it always encodes a score. Each swatch prints its hex, so the palette reads without relying on color alone.
Purple appears exactly once in the whole system, as one of six letter-avatar backgrounds. It is data, never a button, accent, or brand color. A purple call-to-action is the loudest tell the detector knows, so it lives nowhere near one.
Three faces, each with a job.
Newsreader carries display and voice, and is never used for body. Libre Franklin carries all prose. JetBrains Mono carries anything that reads as data, a label, a score, or code. All three load from Google Fonts.
Critique the page, never the person.
A score reads the page, not the team behind it. The voice is a senior designer reading the page back to you: dry, specific, and a little funny. Same register at every tier.
Clean. Real type, honest spacing, a layout that knows what it is for. Nothing to fix here.
Mild. Mostly considered, but the gradient hero and the three icon cards are reflexes, not decisions.
Heavy. A default sans, a glowing call-to-action, an aurora blob, a centered headline. It reads like the tool that made it, not the company that shipped it.
A score you can embed.
The badge is two segments: a dark slop label and the tier-colored grade and score. It is the one element in the system allowed a shadow, a flat 1px one, because it has to read on top of someone else's page.
What keeps this page clean.
The same rules the detector checks for, stated as a habit. Empty is better than fake.
- Show the product. Screenshot the real thing.
- Use real type and let it set the rhythm.
- Let whitespace carry the hierarchy.
- State the score plainly, good or bad.
- Cite the source. Link the method.
- Keep the paper surface cool neutral (#F4F5F2, never warm cream) and hold >= 4.5:1 WCAG AA contrast on every light and dark label.
- Add a gradient so it feels expensive.
- Reach for the default font stack.
- Color the main button for the vibe.
- Decorate an empty section to fill it.
- Use a sparkle glyph to signal AI.
Take the kit.
Favicon, app icons and the social card, ready to drop in. The favicon keeps the reticle legible at 16px in a browser tab; the app icons cover home-screen and PWA installs.
drop-in <head>
<link rel="icon" href="/brand/favicon.svg" type="image/svg+xml">
<link rel="icon" href="/brand/favicon-32.png" sizes="32x32" type="image/png">
<link rel="apple-touch-icon" href="/brand/apple-touch-icon.png">
<link rel="manifest" href="/brand/site.webmanifest">
<meta name="theme-color" content="#16170F">
<meta property="og:image" content="/brand/og-card.png">
<meta name="twitter:card" content="summary_large_image">See if your page looks generated.
One scan, about eight seconds, no signup.
Empty is better than fake. Show the product, don't decorate around it.