Each tell reads as "generated" because the measured top sites don't do it. Numbers are from the 24-site teardown (2026-09-15). Run this list against screenshots at 1440 and 390.
1. Purple→blue gradients. 0 of 24 sites put a gradient on a CTA or headline at the fold; Stripe's gradient is an art-directed WebGL ribbon.
tsx Copy // before < a className = "bg-gradient-to-r from-indigo-500 to-purple-600 text-white shadow-lg" >Get started</ a > // after < Button href = "/signup" size = "lg" >Start free trial</ Button > // bg-brand, flat, inset highlight 2. Gradient headline text. (design/gradient-text
tsx Copy // before < h1 className = "bg-gradient-to-r from-sky-400 to-fuchsia-500 bg-clip-text text-transparent" >The future of work</ h1 > // after < h1 className = "max-w-[16ch] text-display-lg text-fg" >Standups in 4 minutes. < span className = "text-fg-muted" >Written by the tickets.</ span ></ h1 > 3. Rainbow accents. Measured accent use ≤ 5% of elements, one hue. (design/multiple-accents
tsx Copy // before: <Zap className="text-yellow-500"/> <Shield className="text-green-500"/> <Globe className="text-purple-500"/> // after: every icon className="size-4 text-fg-muted"; brand only on the CTA and links 4. Pure black on white + gray-500. Foregrounds measured: #171717, #141413, #26251e; backgrounds #fafafa, #faf9f5.
tsx Copy // before <body className="bg-white text-black"> <p className="text-gray-500"> // after (nothing on body: base sets bg-bg text-fg) <p className="text-fg-muted"> 5. Solid gray borders everywhere. Measured hairlines are 1px at 5–12% alpha.
tsx Copy // before <div className="border border-gray-200 rounded-2xl shadow-md p-6"> // after <div className="rounded-xl border border-line-subtle p-6"> // or surface-card 6. Glass cards. Blur measured only on headers (Linear 20px, Mercury 10px) and overlays.
tsx Copy // before <div className="backdrop-blur-xl bg-white/10 border border-white/20 rounded-3xl"> // after <div className="rounded-xl bg-surface border border-line-subtle"> 7. Blob/orb hero.
tsx Copy // before <div className="absolute -top-40 left-1/2 size-[600px] rounded-full bg-purple-500/30 blur-3xl" /> // after one edge light at 12% brand, or none, plus a real product frame or a typographic hero < div aria-hidden className = "pointer-events-none absolute inset-x-0 top-0 -z-10 h-144 bg-[radial-gradient(60%_70%_at_20%_0%,color-mix(in_oklch,var(--brand)_12%,transparent),transparent_70%)]" /> 8. Default selection and focus. 20/24 sites brand the selection. Fix: don't override base (::selection, :focus-visible); delete any outline-none.
9. Default tracking on big headings. 14/18 sites with ≥ 40px display text use negative tracking. (design/heading-tracking
tsx Copy // before <h1 className="text-6xl font-bold tracking-normal leading-tight"> // after <h1 className="text-display-lg"> // size, lh 0.96, −0.04em×knob, weight from direction 10. Bold display. 18/23 measured H1s ≤ 600. Remove font-bold/font-extrabold from headings.
11. Loose display leading. Measured 0.85–1.15. Never leading-normal/leading-relaxed on text-display*.
12. No small-type texture. Workhorse is 14px; mono labels add technical texture.
tsx Copy // before <p className="text-base">Pipelines</p> // after <p className="label-mono text-fg-muted">01 · Pipelines</p> 13. Wide grey hero sub. Measured max-width 480–672px.
tsx Copy // before <p className="mx-auto max-w-4xl text-xl text-gray-500"> // after <p className="mt-6 max-w-[44ch] text-lg text-fg-muted"> 14. Orphans. Base sets text-wrap: balance on h1–h4; also cap width: max-w-[16ch].
15. Too many fonts. ≤ 2 families + mono (design/too-many-font-familieslint/google-fonts-linknext/font loaders.
16. Everything centered. Interior headings centered: Linear 1/14, Stripe 1/32.
tsx Copy // before <div className="text-center"><h2>…</h2><p className="mx-auto">…</p></div> // after <div className="grid gap-6 lg:grid-cols-12"><h2 className="lg:col-span-5">…</h2><p className="lg:col-span-6 lg:col-start-7">…</p></div> 17. The template page (badge → centered H1 → 2 buttons → glow screenshot → 3 icon cards → logos → testimonials → pricing → FAQ → CTA). Fix: plan sections from the brief with archetypes (website/references/section-archetypes.md
18. Three identical icon cards. None of the top sites uses it as the primary feature explainer.
tsx Copy // before < div className = "grid grid-cols-3 gap-8" >{ features .map (f => < div className = "rounded-2xl p-8 shadow" >< div className = "size-12 rounded-full bg-indigo-100" >< f.icon /></ div >< h3 >{ f .title}</ h3 >< p >{ f .body}</ p ></ div >)}</ div > // after: feature rows with real UI, or an editorial divided list < ul className = "divide-y divide-line-subtle border-y border-line-subtle" > { features .map ((f , i) => ( < li key = { f .title} className = "grid gap-3 py-6 lg:grid-cols-12" > < span className = "label-mono text-fg-subtle lg:col-span-2" >{ String (i + 1 ) .padStart ( 2 , "0" )}</ span > < h3 className = "text-xl text-fg lg:col-span-4" >{ f .title}</ h3 > < p className = "text-md text-fg-muted lg:col-span-6" >{ f .body}</ p > </ li > ))} </ ul > 19. Random bento. Spans must follow importance; each tile shows something real (UI, data, code). If tiles would hold only icon + title + text, use tell 18's list instead.
20. Uniform section padding. Measured 96–160px with variation. Replace every py-20 with the rhythm table in layout.md
21. Unreadable line length. max-w-7xl paragraphs → max-w-prose or max-w-[60ch] (design/line-length-long
22. Generic navbar (80px, 5 centered links, gradient button). Measured headers 56–72px, CTA solid neutral or brand, small.
tsx Copy // after: template SiteHeader — sticky h-(--header-h), text-sm links text-fg-muted, Button size="sm" 23. rounded-2xl shadow-xl everywhere. shadow-xl doesn't exist in void (emits nothing) and cards cap at rounded-xl.
tsx Copy // before <div className="rounded-3xl shadow-2xl p-10"> // after <Card className="p-6"> // surface-card: radius-xl + hairline + shadow-1 24. Border + shadow + bg change on hover.
tsx Copy // before <a className="border shadow hover:shadow-xl hover:bg-gray-50 hover:border-indigo-500 hover:-translate-y-2"> // after <a className="press rounded-xl border border-line-subtle p-6 transition-colors duration-(--duration-fast) hover:border-line-strong"> 25. Non-concentric corners. rounded-2xl parent with p-2 and rounded-2xl child → radius-nested on the parent.
26. Emoji or circled icons. (design/emoji-icons
tsx Copy // before <h3>🚀 Fast deploys</h3> <div className="grid size-12 place-items-center rounded-full bg-blue-100"><Rocket/></div> // after <h3 className="flex items-center gap-2 text-xl"><Rocket aria-hidden className="size-4 text-fg-muted" strokeWidth={1.5}/>Fast deploys</h3> 27. Hover scale-up and glowing buttons. Measured press is scale down 0.96–0.98; hover is a color step in 100–200ms.
tsx Copy // before <button className="transition-all duration-300 hover:scale-105 shadow-lg shadow-indigo-500/50"> // after <Button>Deploy</Button> // press utility + bg-brand → hover:bg-brand-hover 28. Fake proof. Invented logos, "10K+ users", 5-star carousels with stock avatars. Fix: real proof or omit. Placeholder protocol in website
29. Fade-up on every section; transition-all duration-300. (lint/transition-allsmooth/transition-all
tsx Copy // before <motion.section initial={{opacity:0,y:50}} whileInView={{opacity:1,y:0}} transition={{duration:1}}> // after <section className="section-y"> … <figure className="reveal">…</figure> // 1–3 reveals per page, CSS only 30. Buzzword copy.
text Copy before Unlock the power of AI to supercharge your workflow seamlessly. after Turns a 40-minute incident review into a 3-paragraph summary with links to every log line. Banned list and headline formulas: website/references/copy-and-content.md
No :focus-visible style · no dark color-scheme / flash of wrong theme · lorem ipsum or "John Doe" · no empty/error/loading states · arbitrary values (p-[18px], text-[#a1a1aa], lint/tw-arbitrary-sprawl</code> "Create Next App" · 12px tap targets · horizontal scroll at 390px.</p>
</div><footer class="mt-16 border-t border-line-subtle pt-8 pb-20"><div class="flex flex-wrap items-center justify-between gap-3 font-mono text-xs text-fg-muted"><span>Updated <time dateTime="2026-09-16">16 Sept 2026</time></span><span class="flex gap-4"><a href="/docs/craft/anti-slop.md" class="hover:text-fg">View as Markdown</a><a href="https://github.com/ParthKapoor-dev/design/blob/main/skills/craft/references/anti-slop.md" rel="noopener noreferrer" class="hover:text-fg">Edit on GitHub</a></span></div><div class="mt-8 grid gap-3 sm:grid-cols-2"><a class="press group flex flex-col gap-1 rounded-lg border border-line-subtle p-4 transition-colors duration-(--duration-fast) hover:border-line-strong" href="/docs/craft"><span class="label-mono flex items-center gap-1.5 text-fg-muted"><svg aria-hidden="true" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.5" class="size-3"><path d="M13 8H3.5M7.5 4l-4 4 4 4" stroke-linecap="round" stroke-linejoin="round"></path></svg> Previous</span><span class="text-sm text-fg">craft skill</span></a><a class="press group flex flex-col items-end gap-1 rounded-lg border border-line-subtle p-4 text-right transition-colors duration-(--duration-fast) hover:border-line-strong" href="/docs/craft/color"><span class="label-mono flex items-center gap-1.5 text-fg-muted">Next <svg aria-hidden="true" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.5" class="size-3"><path d="M3 8h9.5M8.5 4l4 4-4 4" stroke-linecap="round" stroke-linejoin="round"></path></svg></span><span class="text-sm text-fg">craft: color</span></a></div></footer></article><aside aria-label="Page contents" class="hidden xl:block"><div data-lenis-prevent="true" class="sticky top-(--header-h) max-h-[calc(100dvh-var(--header-h))] overflow-y-auto pt-4 pb-10 [scrollbar-width:thin]"><nav aria-label="On this page" class="text-sm"><p class="label-mono mb-3 text-fg-muted">On this page</p><ul class="grid gap-1.5 border-l border-line-subtle"><li><a href="#color" class="block py-0.5 pr-2 text-fg-muted transition-colors duration-(--duration-fast) hover:text-fg pl-4">Color</a></li><li><a href="#typography" class="block py-0.5 pr-2 text-fg-muted transition-colors duration-(--duration-fast) hover:text-fg pl-4">Typography</a></li><li><a href="#layout" class="block py-0.5 pr-2 text-fg-muted transition-colors duration-(--duration-fast) hover:text-fg pl-4">Layout</a></li><li><a href="#components-and-details" class="block py-0.5 pr-2 text-fg-muted transition-colors duration-(--duration-fast) hover:text-fg pl-4">Components and details</a></li><li><a href="#motion-and-copy" class="block py-0.5 pr-2 text-fg-muted transition-colors duration-(--duration-fast) hover:text-fg pl-4">Motion and copy</a></li><li><a href="#omissions-that-also-betray-generation" class="block py-0.5 pr-2 text-fg-muted transition-colors duration-(--duration-fast) hover:text-fg pl-4">Omissions that also betray generation</a></li></ul></nav></div></aside></div></div><!--$--><!--/$--></main><footer class="relative mt-24 overflow-hidden border-t border-line px-(--gutter)"><div aria-hidden="true" class="pointer-events-none absolute -bottom-[40vw] left-1/2 size-[80vw] -translate-x-1/2 rounded-full bg-[radial-gradient(closest-side,color-mix(in_oklab,var(--flare)_12%,transparent),transparent)]"></div><div class="relative mx-auto grid max-w-7xl gap-12 py-16 md:grid-cols-12 md:gap-8"><div class="md:col-span-5"><a class="inline-flex items-center gap-2.5 text-ink" aria-label="void home" href="/"><svg viewBox="0 0 32 32" class="size-6" aria-hidden="true"><defs><radialGradient id="mk" cx="50%" cy="50%" r="50%"><stop offset="0.52" stop-color="#000"></stop><stop offset="0.6" stop-color="var(--flare-2)"></stop><stop offset="0.8" stop-color="var(--flare)" stop-opacity="0.6"></stop><stop offset="1" stop-color="var(--flare)" stop-opacity="0"></stop></radialGradient></defs><ellipse cx="16" cy="16" rx="15" ry="5" fill="none" stroke="var(--flare)" stroke-opacity="0.8" stroke-width="1.4" transform="rotate(-18 16 16)"></ellipse><circle cx="16" cy="16" r="10" fill="url(#mk)"></circle></svg><span class="text-lg font-medium tracking-tight">void</span></a><p class="mt-4 max-w-[44ch] text-mute">A design system for AI coding agents. This site is built with it and audited by it on every change.</p><p class="mt-6 inline-flex flex-wrap items-center gap-x-4 gap-y-1 rounded-full border border-line-2 bg-black/40 px-4 py-2 font-mono text-xs text-mute"><span class="text-flare-2">void audit</span><span>perf<!-- --> <span class="text-ink tabular-nums">100</span></span><span>a11y<!-- --> <span class="text-ink tabular-nums">100</span></span><span>seo<!-- --> <span class="text-ink tabular-nums">99</span></span><span>geo<!-- --> <span class="text-ink tabular-nums">100</span></span></p></div><nav aria-label="Product" class="md:col-span-2 md:first-of-type:col-start-7"><p class="kicker">Product</p><ul class="mt-4 grid gap-2"><li><a class="inline-flex min-h-6 items-center text-sm text-mute transition-colors hover:text-ink" href="/docs">Docs</a></li><li><a class="inline-flex min-h-6 items-center text-sm text-mute transition-colors hover:text-ink" href="/cli">CLI reference</a></li><li><a class="inline-flex min-h-6 items-center text-sm text-mute transition-colors hover:text-ink" href="/rules">Rules</a></li><li><a class="inline-flex min-h-6 items-center text-sm text-mute transition-colors hover:text-ink" href="/directions">Directions</a></li><li><a class="inline-flex min-h-6 items-center text-sm text-mute transition-colors hover:text-ink" href="/evals">Evals</a></li></ul></nav><nav aria-label="For agents" class="md:col-span-2 md:first-of-type:col-start-7"><p class="kicker">For agents</p><ul class="mt-4 grid gap-2"><li><a href="/llms.txt" class="inline-flex min-h-6 items-center text-sm text-mute transition-colors hover:text-ink">llms.txt</a></li><li><a href="/llms-full.txt" class="inline-flex min-h-6 items-center text-sm text-mute transition-colors hover:text-ink">llms-full.txt</a></li><li><a href="/index.md" class="inline-flex min-h-6 items-center text-sm text-mute transition-colors hover:text-ink">index.md</a></li><li><a href="/sitemap.xml" class="inline-flex min-h-6 items-center text-sm text-mute transition-colors hover:text-ink">sitemap.xml</a></li></ul></nav><nav aria-label="Source" class="md:col-span-2 md:first-of-type:col-start-7"><p class="kicker">Source</p><ul class="mt-4 grid gap-2"><li><a href="https://github.com/ParthKapoor-dev/design" rel="noopener noreferrer" class="inline-flex min-h-6 items-center text-sm text-mute transition-colors hover:text-ink">GitHub</a></li><li><a href="https://github.com/ParthKapoor-dev/design/blob/main/LICENSE" rel="noopener noreferrer" class="inline-flex min-h-6 items-center text-sm text-mute transition-colors hover:text-ink">MIT licence</a></li><li><a href="https://parthkapoor.me" rel="noopener noreferrer" class="inline-flex min-h-6 items-center text-sm text-mute transition-colors hover:text-ink">Parth Kapoor</a></li></ul></nav></div><p aria-hidden="true" class="wordmark relative mx-auto max-w-7xl select-none text-center font-semibold leading-[0.72] tracking-[-0.06em] text-[clamp(6rem,24vw,22rem)]">void</p><div class="relative mx-auto flex max-w-7xl flex-wrap items-center justify-between gap-4 border-t border-line py-6 font-mono text-xs text-mute"><span>© 2026 <!-- -->Parth Kapoor<!-- --> · <!-- -->MIT</span><a href="https://parthkapoor.me" rel="author noopener" class="built-by built-by--sm" data-magnet="true"><span class="text-mute">Built by</span><svg viewBox="0 0 32 32" class="built-by__mark size-5" aria-hidden="true"><rect width="32" height="32" rx="7" fill="#0c0c0f"></rect><rect x="0.5" y="0.5" width="31" height="31" rx="6.5" fill="none" stroke="#2b2b35"></rect><path fill="#e9e4d4" fill-rule="evenodd" d="M5 6h16v13H10v7H5V6Zm5 4h6v5h-6v-5Z"></path><rect class="built-by__stop" x="22" y="21" width="5" height="5" rx="1" fill="var(--flare)"></rect></svg><span class="roll"><span class="sr-only">parthkapoor.me</span><span aria-hidden="true" class="roll__row"><span class="roll__ch" style="--d:0s"><span>p</span><span class="roll__twin">p</span></span><span class="roll__ch" style="--d:0.018s"><span>a</span><span class="roll__twin">a</span></span><span class="roll__ch" style="--d:0.036s"><span>r</span><span class="roll__twin">r</span></span><span class="roll__ch" style="--d:0.05399999999999999s"><span>t</span><span class="roll__twin">t</span></span><span class="roll__ch" style="--d:0.072s"><span>h</span><span class="roll__twin">h</span></span><span class="roll__ch" style="--d:0.09s"><span>k</span><span class="roll__twin">k</span></span><span class="roll__ch" style="--d:0.10799999999999998s"><span>a</span><span class="roll__twin">a</span></span><span class="roll__ch" style="--d:0.126s"><span>p</span><span class="roll__twin">p</span></span><span class="roll__ch" style="--d:0.144s"><span>o</span><span class="roll__twin">o</span></span><span class="roll__ch" style="--d:0.16199999999999998s"><span>o</span><span class="roll__twin">o</span></span><span class="roll__ch" style="--d:0.18s"><span>r</span><span class="roll__twin">r</span></span><span class="roll__ch" style="--d:0.19799999999999998s"><span>.</span><span class="roll__twin">.</span></span><span class="roll__ch" style="--d:0.21599999999999997s"><span>m</span><span class="roll__twin">m</span></span><span class="roll__ch" style="--d:0.23399999999999999s"><span>e</span><span class="roll__twin">e</span></span></span></span><span aria-hidden="true" class="built-by__arrow">↗</span></a><span>void-design.vercel.app</span></div></footer><div class="grain" aria-hidden="true"></div><script type="application/ld+json">{"@context":"https://schema.org","@graph":[{"@type":"Organization","@id":"https://void-design.vercel.app/#organization","name":"void","url":"https://void-design.vercel.app/","logo":"https://void-design.vercel.app/icon-512.png","sameAs":["https://github.com/ParthKapoor-dev/design"]},{"@type":"WebSite","@id":"https://void-design.vercel.app/#website","name":"void","url":"https://void-design.vercel.app/","description":"void is an open-source design system for AI coding agents: Claude Code skills, Tailwind v4 tokens and a CLI that audits speed, accessibility, SEO and design.","inLanguage":"en","publisher":{"@id":"https://void-design.vercel.app/#organization"}}]}</script><script src="/_next/static/immutable/chunks/39mze7sr9bsct.js" id="_R_" async=""></script><script>(self.__next_f=self.__next_f||[]).push([0])</script><script>self.__next_f.push([1,"1:\"$Sreact.fragment\"\n2:I[46810,[\"/_next/static/immutable/chunks/3kyyc8_ntqnp4.js\"],\"SmoothScroll\"]\n3:I[45110,[\"/_next/static/immutable/chunks/3kyyc8_ntqnp4.js\"],\"Cursor\"]\n4:I[75514,[\"/_next/static/immutable/chunks/3kyyc8_ntqnp4.js\"],\"Magnetic\"]\n5:I[88287,[\"/_next/static/immutable/chunks/455sb5e0fgpzb.js\"],\"default\"]\n6:I[74895,[\"/_next/static/immutable/chunks/455sb5e0fgpzb.js\"],\"default\"]\n7:I[821,[\"/_next/static/immutable/chunks/3kyyc8_ntqnp4.js\",\"/_next/static/immutable/chunks/0bbcxmn-vo11k.js\"],\"Nav\"]\n8:I[23408,[\"/_next/static/immutable/chunks/3kyyc8_ntqnp4.js\",\"/_next/static/immutable/chunks/0bbcxmn-vo11k.js\"],\"CanvasRoot\"]\n9:I[57715,[\"/_next/static/immutable/chunks/3kyyc8_ntqnp4.js\",\"/_next/static/immutable/chunks/0bbcxmn-vo11k.js\",\"/_next/static/immutable/chunks/10-jx0r2jtr5s.js\",\"/_next/static/immutable/chunks/2-9e3j82g4al3.js\",\"/_next/static/immutable/chunks/15spxoq7fze2b.js\"],\"PageHero\"]\na:I[4561,[\"/_next/static/immutable/chunks/3kyyc8_ntqnp4.js\",\"/_next/static/immutable/chunks/0bbcxmn-vo11k.js\",\"/_next/static/immutable/chunks/10-jx0r2jtr5s.js\",\"/_next/static/immutable/chunks/2-9e3j82g4al3.js\",\"/_next/static/immutable/chunks/15spxoq7fze2b.js\"],\"\"]\n17:I[52576,[\"/_next/static/immutable/chunks/3kyyc8_ntqnp4.js\"],\"default\",1]\n:HL[\"/_next/static/immutable/chunks/2mzoeot222o9m.css\",\"style\"]\n:HL[\"/_next/static/immutable/media/797e433ab948586e-s.p.1v5bejj26fx9h.woff2\",\"font\",{\"crossOrigin\":\"\",\"type\":\"font/woff2\"}]\n:HL[\"/_next/static/immutable/media/7ebf22b5a21034f8-s.p.3strvg7o-g5v2.woff2\",\"font\",{\"crossOrigin\":\"\",\"type\":\"font/woff2\"}]\n:HL[\"/_next/static/immutable/media/caa3a2e1cccd8315-s.p.0zr6hhvz-h9nw.woff2\",\"font\",{\"crossOrigin\":\"\",\"type\":\"font/woff2\"}]\n15:X\n0:{\"P\":null,\"c\":[\"\",\"docs\",\"craft\",\"anti-slop\"],\"q\":\"\",\"i\":false,\"f\":[[[\"\",{\"children\":[\"(pages)\",{\"children\":[\"docs\",{\"children\":[[\"skill\",\"craft\",\"d\",[]],{\"children\":[[\"ref\",\"anti-slop\",\"d\",[]],{\"children\":[\"__PAGE__\",{},\"$undefined\",\"$undefined\",4608]},\"$undefined\",\"$undefined\",4608]},\"$undefined\",\"$undefined\",4608]},\"$undefined\",\"$undefined\",4608]},\"$undefined\",\"$undefined\",4608]},\"$undefined\",\"$undefined\",4624],[[\"$\",\"$1\",\"c\",{\"children\":[[[\"$\",\"link\",\"0\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/immutable/chunks/2mzoeot222o9m.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\",\"nonce\":\"$undefined\"}],[\"$\",\"script\",\"script-0\",{\"src\":\"/_next/static/immutable/chunks/3kyyc8_ntqnp4.js\",\"async\":true,\"nonce\":\"$undefined\"}]],[\"$\",\"html\",null,{\"lang\":\"en\",\"className\":\"geist_e799d87a-module__u8MhCG__variable geist_mono_8f04fc5a-module__ZGwrmq__variable instrument_serif_d5a02a32-module__PnFala__variable\",\"suppressHydrationWarning\":true,\"children\":[[\"$\",\"head\",null,{\"children\":[[\"$\",\"script\",null,{\"dangerouslySetInnerHTML\":{\"__html\":\"document.documentElement.classList.add(\\\"js\\\")\"}}],[\"$\",\"link\",null,{\"rel\":\"describedby\",\"type\":\"text/markdown\",\"href\":\"/llms.txt\"}]]}],[\"$\",\"body\",null,{\"children\":[[\"$\",\"$L2\",null,{}],[\"$\",\"$L3\",null,{}],[\"$\",\"$L4\",null,{}],[\"$\",\"$L5\",null,{\"parallelRouterKey\":\"children\",\"error\":\"$undefined\",\"errorStyles\":\"$undefined\",\"errorScripts\":\"$undefined\",\"template\":[\"$\",\"$L6\",null,{}],\"templateStyles\":\"$undefined\",\"templateScripts\":\"$undefined\",\"notFound\":[[[\"$\",\"$L7\",null,{}],[\"$\",\"div\",null,{\"aria-hidden\":\"true\",\"children\":[\"$\",\"$L8\",null,{}]}],[\"$\",\"main\",null,{\"id\":\"main\",\"className\":\"page-shell relative px-(--gutter)\",\"children\":[\"$\",\"$L9\",null,{\"scene\":\"snow\",\"crumbs\":[{\"name\":\"void\",\"path\":\"/\"},{\"name\":\"404\"}],\"kicker\":\"HTTP 404 · noindex\",\"title\":[\"Nothing measured \",[\"$\",\"span\",null,{\"className\":\"serif hot\",\"children\":\"at this address.\"}]],\"lead\":\"The link may be old, or a rule id was renamed. Everything that exists is one of these.\",\"children\":[\"$\",\"div\",null,{\"className\":\"enter mt-10 max-w-xl overflow-hidden rounded-2xl border border-line-2 bg-black/60 font-mono text-sm backdrop-blur-md\",\"style\":{\"--d\":\"0.45s\"},\"children\":[[\"$\",\"div\",null,{\"className\":\"flex h-10 items-center justify-between border-b border-line px-4\",\"children\":[[\"$\",\"span\",null,{\"className\":\"label-mono text-fg-subtle\",\"children\":\"~/void\"}],[\"$\",\"span\",null,{\"className\":\"label-mono text-danger\",\"children\":\"exit 3\"}]]}],[\"$\",\"div\",null,{\"className\":\"px-4 py-4 leading-7\",\"children\":[[\"$\",\"p\",null,{\"children\":[[\"$\",\"span\",null,{\"className\":\"text-flare\",\"children\":\"$$\"}],\" \",[\"$\",\"span\",null,{\"className\":\"text-fg\",\"children\":\"curl -sI this-page\"}]]}],[\"$\",\"p\",null,{\"className\":\"text-fg-muted\",\"children\":[\"HTTP/2 \",[\"$\",\"span\",null,{\"className\":\"text-danger\",\"children\":\"404\"}]]}],[\"$\",\"p\",null,{\"className\":\"mt-3 text-fg-subtle\",\"children\":\"# try one of these\"}],[\"$\",\"ul\",null,{\"children\":[[\"$\",\"li\",\"/docs\",{\"children\":[\"$\",\"$La\",null,{\"href\":\"/docs\",\"className\":\"group flex min-h-7 flex-wrap items-center gap-x-3 text-fg transition-colors hover:text-brand-text\",\"children\":[[\"$\",\"span\",null,{\"children\":[[\"$\",\"span\",null,{\"className\":\"text-flare\",\"children\":\"$$\"}],\" \",\"cd /docs\"]}],[\"$\",\"span\",null,{\"className\":\"text-fg-subtle group-hover:text-fg-muted\",\"children\":[\"# \",\"install, the starter, the skills\"]}]]}]}],[\"$\",\"li\",\"/rules\",{\"children\":[\"$\",\"$La\",null,{\"href\":\"/rules\",\"className\":\"group flex min-h-7 flex-wrap items-center gap-x-3 text-fg transition-colors hover:text-brand-text\",\"children\":[[\"$\",\"span\",null,{\"children\":[[\"$\",\"span\",null,{\"className\":\"text-flare\",\"children\":\"$$\"}],\" \",\"void rules\"]}],[\"$\",\"span\",null,{\"className\":\"text-fg-subtle group-hover:text-fg-muted\",\"children\":[\"# \",\"every rule id the CLI can print\"]}]]}]}],[\"$\",\"li\",\"/cli\",{\"children\":[\"$\",\"$La\",null,{\"href\":\"/cli\",\"className\":\"group flex min-h-7 flex-wrap items-center gap-x-3 text-fg transition-colors hover:text-brand-text\",\"children\":[[\"$\",\"span\",null,{\"children\":[[\"$\",\"span\",null,{\"className\":\"text-flare\",\"children\":\"$$\"}],\" \",\"void --help\"]}],[\"$\",\"span\",null,{\"className\":\"text-fg-subtle group-hover:text-fg-muted\",\"children\":[\"# \",\"commands, flags and exit codes\"]}]]}]}],[\"$\",\"li\",\"/\",{\"children\":[\"$\",\"$La\",null,{\"href\":\"/\",\"className\":\"group flex min-h-7 flex-wrap items-center gap-x-3 text-fg transition-colors hover:text-brand-text\",\"children\":[[\"$\",\"span\",null,{\"children\":[[\"$\",\"span\",null,{\"className\":\"text-flare\",\"children\":\"$$\"}],\" \",\"cd ~\"]}],[\"$\",\"span\",null,{\"className\":\"text-fg-subtle group-hover:text-fg-muted\",\"children\":[\"# \",\"home\"]}]]}]}]]}]]}]]}]}]}],[\"$\",\"footer\",null,{\"className\":\"relative mt-24 overflow-hidden border-t border-line px-(--gutter)\",\"children\":[[\"$\",\"div\",null,{\"aria-hidden\":\"true\",\"className\":\"pointer-events-none absolute -bottom-[40vw] left-1/2 size-[80vw] -translate-x-1/2 rounded-full bg-[radial-gradient(closest-side,color-mix(in_oklab,var(--flare)_12%,transparent),transparent)]\"}],\"$Lb\",\"$Lc\",\"$Ld\"]}]],[]],\"forbidden\":\"$undefined\",\"unauthorized\":\"$undefined\"}],\"$Le\",\"$Lf\"]}]]}]]}],{\"children\":[\"$L10\",{\"children\":[\"$L11\",{\"children\":[\"$L12\",{\"children\":[\"$L13\",{\"children\":[\"$L14\",{},null,false,null]},null,false,\"$15\"]},null,false,\"$15\"]},null,false,\"$15\"]},null,false,null]},null,false,null],\"$L16\",false]],\"m\":\"$undefined\",\"G\":[\"$17\",[\"$L18\"]],\"S\":true,\"h\":null,\"r\":\"$undefined\",\"s\":\"$undefined\",\"a\":\"$undefined\",\"l\":\"$undefined\",\"p\":\"$undefined\",\"d\":\"$undefined\",\"b\":\"elsVGvzxufI0WNd6tiC6K\"}\n19:I[821,[\"/_next/static/immutable/chunks/3kyyc8_ntqnp4.js\",\"/_next/static/immutable/chunks/0bbcxmn-vo11k.js\"],\"Mark\"]\n1b:I[44327,[\"/_next/static/immutable/chunks/3kyyc8_ntqnp4.js\",\"/_next/static/immutable/chunks/0bbcxmn-vo11k.js\"],\"BuiltBy\"]\n28:I[51858,[\"/_next/static/immutable/chunks/455sb5e0fgpzb.js\"],\"OutletBoundary\"]\n29:\"$Sreact.suspense\"\n2b:I[51858,[\"/_next/static/immutable/chunks/455sb5e0fgpzb.js\"],\"ViewportBoundary\"]\n2d:I[51858,[\"/_next/static/immutable/chunks/455sb5e0fgpzb.js\"],\"MetadataBoundary\"]\nb:[\"$\",\"div\",null,{\"className\":\"relative mx-auto grid max-w-7xl gap-12 py-16 md:grid-cols-12 md:gap-8\",\"children\":[[\"$\",\"div\",null,{\"className\":\"md:col-span-5\",\"children\":[[\"$\",\"$La\",null,{\"href\":\"/\",\"className\":\"inline-flex items-center gap-2.5 text-ink\",\"aria-label\":\"void home\",\"children\":[[\"$\",\"$L19\",null,{\"className\":\"size-6\"}],[\"$\",\"span\",null,{\"className\":\"text-lg font-medium tracking-tight\",\"children\":\"void\"}]]}],[\"$\",\"p\",null,{\"className\":\"mt-4 max-w-[44ch] text-mute\",\"children\":\"A design system for AI coding agents. This site is built with it and audited by it on every change.\"}],[\"$\",\"p\",null,{\"className\":\"mt-6 inline-flex flex-wrap items-center gap-x-4 gap-y-1 rounded-full border border-line-2 bg-black/40 px-4 py-2 font-mono text-xs text-mute\",\"children\":[[\"$\",\"span\",null,{\"className\":\"text-flare-2\",\"children\":\"void audit\"}],[[\"$\",\"span\",\"perf\",{\"children\":[\"perf\",\" \",[\"$\",\"span\",null,{\"className\":\"text-ink tabular-nums\",\"children\":\"100\"}]]}],[\"$\",\"span\",\"a11y\",{\"children\":[\"a11y\",\" \",[\"$\",\"span\",null,{\"className\":\"text-ink tabular-nums\",\"children\":\"100\"}]]}],[\"$\",\"span\",\"seo\",{\"children\":[\"seo\",\" \",[\"$\",\"span\",null,{\"className\":\"text-ink tabular-nums\",\"children\":\"99\"}]]}],[\"$\",\"span\",\"geo\",{\"children\":[\"geo\",\" \",[\"$\",\"span\",null,{\"className\":\"text-ink tabular-nums\",\"children\":\"100\"}]]}]]]}]]}],[[\"$\",\"nav\",\"Product\",{\"aria-label\":\"Product\",\"className\":\"md:col-span-2 md:first-of-type:col-start-7\",\"children\":[[\"$\",\"p\",null,{\"className\":\"kicker\",\"children\":\"Product\"}],[\"$\",\"ul\",null,{\"className\":\"mt-4 grid gap-2\",\"children\":[[\"$\",\"li\",\"/docs\",{\"children\":[\"$\",\"$La\",null,{\"href\":\"/docs\",\"className\":\"inline-flex min-h-6 items-center text-sm text-mute transition-colors hover:text-ink\",\"children\":\"Docs\"}]}],[\"$\",\"li\",\"/cli\",{\"children\":[\"$\",\"$La\",null,{\"href\":\"/cli\",\"className\":\"inline-flex min-h-6 items-center text-sm text-mute transition-colors hover:text-ink\",\"children\":\"CLI reference\"}]}],[\"$\",\"li\",\"/rules\",{\"children\":[\"$\",\"$La\",null,{\"href\":\"/rules\",\"className\":\"inline-flex min-h-6 items-center text-sm text-mute transition-colors hover:text-ink\",\"children\":\"Rules\"}]}],[\"$\",\"li\",\"/directions\",{\"children\":[\"$\",\"$La\",null,{\"href\":\"/directions\",\"className\":\"inline-flex min-h-6 items-center text-sm text-mute transition-colors hover:text-ink\",\"children\":\"Directions\"}]}],[\"$\",\"li\",\"/evals\",{\"children\":[\"$\",\"$La\",null,{\"href\":\"/evals\",\"className\":\"inline-flex min-h-6 items-center text-sm text-mute transition-colors hover:text-ink\",\"children\":\"Evals\"}]}]]}]]}],[\"$\",\"nav\",\"For agents\",{\"aria-label\":\"For agents\",\"className\":\"md:col-span-2 md:first-of-type:col-start-7\",\"children\":[[\"$\",\"p\",null,{\"className\":\"kicker\",\"children\":\"For agents\"}],[\"$\",\"ul\",null,{\"className\":\"mt-4 grid gap-2\",\"children\":[[\"$\",\"li\",\"/llms.txt\",{\"children\":[\"$\",\"a\",null,{\"href\":\"/llms.txt\",\"className\":\"inline-flex min-h-6 items-center text-sm text-mute transition-colors hover:text-ink\",\"children\":\"llms.txt\"}]}],[\"$\",\"li\",\"/llms-full.txt\",{\"children\":[\"$\",\"a\",null,{\"href\":\"/llms-full.txt\",\"className\":\"inline-flex min-h-6 items-center text-sm text-mute transition-colors hover:text-ink\",\"children\":\"llms-full.txt\"}]}],[\"$\",\"li\",\"/index.md\",{\"children\":[\"$\",\"a\",null,{\"href\":\"/index.md\",\"className\":\"inline-flex min-h-6 items-center text-sm text-mute transition-colors hover:text-ink\",\"children\":\"index.md\"}]}],[\"$\",\"li\",\"/sitemap.xml\",{\"children\":[\"$\",\"a\",null,{\"href\":\"/sitemap.xml\",\"className\":\"inline-flex min-h-6 items-center text-sm text-mute transition-colors hover:text-ink\",\"children\":\"sitemap.xml\"}]}]]}]]}],[\"$\",\"nav\",\"Source\",{\"aria-label\":\"Source\",\"className\":\"md:col-span-2 md:first-of-type:col-start-7\",\"children\":[[\"$\",\"p\",null,{\"className\":\"kicker\",\"children\":\"Source\"}],[\"$\",\"ul\",null,{\"className\":\"mt-4 grid gap-2\",\"children\":[[\"$\",\"li\",\"https://github.com/ParthKapoor-dev/design\",{\"children\":[\"$\",\"a\",null,{\"href\":\"https://github.com/ParthKapoor-dev/design\",\"rel\":\"noopener noreferrer\",\"className\":\"inline-flex min-h-6 items-center text-sm text-mute transition-colors hover:text-ink\",\"children\":\"GitHub\"}]}],[\"$\",\"li\",\"https://github.com/ParthKapoor-dev/design/blob/main/LICENSE\",{\"children\":[\"$\",\"a\",null,{\"href\":\"https://github.com/ParthKapoor-dev/design/blob/main/LICENSE\",\"rel\":\"noopener noreferrer\",\"className\":\"inline-flex min-h-6 items-center text-sm text-mute transition-colors hover:text-ink\",\"children\":\"MIT licence\"}]}],\"$L1a\"]}]]}]]]}]\nc:[\"$\",\"p\",null,{\"aria-hidden\":\"true\",\"className\":\"wordmark relative mx-auto max-w-7xl select-none text-center font-semibold leading-[0.72] tracking-[-0.06em] text-[clamp(6rem,24vw,22rem)]\",\"children\":\"void\"}]\nd:[\"$\",\"div\",null,{\"className\":\"relative mx-auto flex max-w-7xl flex-wrap items-center justify-between gap-4 border-t border-line py-6 font-mono text-xs text-mute\",\"children\":[[\"$\",\"span\",null,{\"children\":[\"© 2026 \",\"Parth Kapoor\",\" · \",\"MIT\"]}],[\"$\",\"$L1b\",null,{\"size\":\"sm\"}],[\"$\",\"span\",null,{\"children\":\"void-design.vercel.app\"}]]}]\ne:[\"$\",\"div\",null,{\"className\":\"grain\",\"aria-hidden\":\"true\"}]\nf:[\"$\",\"script\",null,{\"type\":\"application/ld+json\",\"dangerouslySetInnerHTML\":{\"__html\":\"{\\\"@context\\\":\\\"https://schema.org\\\",\\\"@graph\\\":[{\\\"@type\\\":\\\"Organization\\\",\\\"@id\\\":\\\"https://void-design.vercel.app/#organization\\\",\\\"name\\\":\\\"void\\\",\\\"url\\\":\\\"https://void-design.vercel.app/\\\",\\\"logo\\\":\\\"https://void-design.vercel.app/icon-512.png\\\",\\\"sameAs\\\":[\\\"https://github.com/ParthKapoor-dev/design\\\"]},{\\\"@type\\\":\\\"WebSite\\\",\\\"@id\\\":\\\"https://void-design.vercel.app/#website\\\",\\\"name\\\":\\\"void\\\",\\\"url\\\":\\\"https://void-design.vercel.app/\\\",\\\"description\\\":\\\"void is an open-source design system for AI coding agents: Claude Code skills, Tailwind v4 tokens and a CLI that audits speed, accessibility, SEO and design.\\\",\\\"inLanguage\\\":\\\"en\\\",\\\"publisher\\\":{\\\"@id\\\":\\\"https://void-design.vercel.app/#organization\\\"}}]}\"}}]\n10:[\"$\",\"$1\",\"c\",{\"children\":[[[\"$\",\"script\",\"script-0\",{\"src\":\"/_next/static/immutable/chunks/0bbcxmn-vo11k.js\",\"async\":true,\"nonce\":\"$undefined\"}]],[[\"$\",\"a\",null,{\"href\":\"#main\",\"className\":\"sr-only z-[60] rounded-full bg-flare px-4 py-2 text-sm font-medium text-black focus:not-sr-only focus:fixed focus:left-4 focus:top-4\",\"children\":\"Skip to content\"}],[\"$\",\"$L7\",null,{}],[\"$\",\"div\",null,{\"aria-hidden\":\"true\",\"children\":[\"$\",\"$L8\",null,{}]}],[\"$\",\"main\",null,{\"id\":\"main\",\"className\":\"page-shell relative\",\"children\":[\"$\",\"$L5\",null,{\"parallelRouterKey\":\"children\",\"error\":\"$undefined\",\"errorStyles\":\"$undefined\",\"errorScripts\":\"$undefined\",\"template\":[\"$\",\"$L6\",null,{}],\"templateStyles\":\"$undefined\",\"templateScripts\":\"$undefined\",\"notFound\":[[[\"$\",\"$L7\",null,{}],[\"$\",\"div\",null,{\"aria-hidden\":\"true\",\"children\":[\"$\",\"$L8\",null,{}]}],[\"$\",\"main\",null,{\"id\":\"main\",\"className\":\"page-shell relative px-(--gutter)\",\"children\":[\"$\",\"$L9\",null,{\"scene\":\"snow\",\"crumbs\":[{\"name\":\"void\",\"path\":\"/\"},{\"name\":\"404\"}],\"kicker\":\"HTTP 404 · noindex\",\"title\":[\"Nothing measured \",[\"$\",\"span\",null,{\"className\":\"serif hot\",\"children\":\"at this address.\"}]],\"lead\":\"The link may be old, or a rule id was renamed. Everything that exists is one of these.\",\"children\":[\"$\",\"div\",null,{\"className\":\"enter mt-10 max-w-xl overflow-hidden rounded-2xl border border-line-2 bg-black/60 font-mono text-sm backdrop-blur-md\",\"style\":{\"--d\":\"0.45s\"},\"children\":[[\"$\",\"div\",null,{\"className\":\"flex h-10 items-center justify-between border-b border-line px-4\",\"children\":[[\"$\",\"span\",null,{\"className\":\"label-mono text-fg-subtle\",\"children\":\"~/void\"}],[\"$\",\"span\",null,{\"className\":\"label-mono text-danger\",\"children\":\"exit 3\"}]]}],[\"$\",\"div\",null,{\"className\":\"px-4 py-4 leading-7\",\"children\":[[\"$\",\"p\",null,{\"children\":[[\"$\",\"span\",null,{\"className\":\"text-flare\",\"children\":\"$$\"}],\" \",[\"$\",\"span\",null,{\"className\":\"text-fg\",\"children\":\"curl -sI this-page\"}]]}],[\"$\",\"p\",null,{\"className\":\"text-fg-muted\",\"children\":[\"HTTP/2 \",[\"$\",\"span\",null,{\"className\":\"text-danger\",\"children\":\"404\"}]]}],[\"$\",\"p\",null,{\"className\":\"mt-3 text-fg-subtle\",\"children\":\"# try one of these\"}],[\"$\",\"ul\",null,{\"children\":[[\"$\",\"li\",\"/docs\",{\"children\":[\"$\",\"$La\",null,{\"href\":\"/docs\",\"className\":\"group flex min-h-7 flex-wrap items-center gap-x-3 text-fg transition-colors hover:text-brand-text\",\"children\":[[\"$\",\"span\",null,{\"children\":[[\"$\",\"span\",null,{\"className\":\"text-flare\",\"children\":\"$$\"}],\" \",\"cd /docs\"]}],[\"$\",\"span\",null,{\"className\":\"text-fg-subtle group-hover:text-fg-muted\",\"children\":[\"# \",\"install, the starter, the skills\"]}]]}]}],[\"$\",\"li\",\"/rules\",{\"children\":[\"$\",\"$La\",null,{\"href\":\"/rules\",\"className\":\"group flex min-h-7 flex-wrap items-center gap-x-3 text-fg transition-colors hover:text-brand-text\",\"children\":[[\"$\",\"span\",null,{\"children\":[[\"$\",\"span\",null,{\"className\":\"text-flare\",\"children\":\"$$\"}],\" \",\"void rules\"]}],[\"$\",\"span\",null,{\"className\":\"text-fg-subtle group-hover:text-fg-muted\",\"children\":[\"# \",\"every rule id the CLI can print\"]}]]}]}],[\"$\",\"li\",\"/cli\",{\"children\":[\"$\",\"$La\",null,{\"href\":\"/cli\",\"className\":\"group flex min-h-7 flex-wrap items-center gap-x-3 text-fg transition-colors hover:text-brand-text\",\"children\":[[\"$\",\"span\",null,{\"children\":[[\"$\",\"span\",null,{\"className\":\"text-flare\",\"children\":\"$$\"}],\" \",\"void --help\"]}],[\"$\",\"span\",null,{\"className\":\"text-fg-subtle group-hover:text-fg-muted\",\"children\":[\"# \",\"commands, flags and exit codes\"]}]]}]}],[\"$\",\"li\",\"/\",{\"children\":[\"$\",\"$La\",null,{\"href\":\"/\",\"className\":\"group flex min-h-7 flex-wrap items-center gap-x-3 text-fg transition-colors hover:text-brand-text\",\"children\":[[\"$\",\"span\",null,{\"children\":[[\"$\",\"span\",null,{\"className\":\"text-flare\",\"children\":\"$$\"}],\" \",\"cd ~\"]}],[\"$\",\"span\",null,{\"className\":\"text-fg-subtle group-hover:text-fg-muted\",\"children\":[\"# \",\"home\"]}]]}]}]]}]]}]]}]}]}],[\"$\",\"footer\",null,{\"className\":\"relative mt-24 overflow-hidden border-t border-line px-(--gutter)\",\"children\":[[\"$\",\"div\",null,{\"aria-hidden\":\"true\",\"className\":\"pointer-events-none absolute -bottom-[40vw] left-1/2 size-[80vw] -translate-x-1/2 rounded-full bg-[radial-gradient(closest-side,color-mix(in_oklab,var(--flare)_12%,transparent),transparent)]\"}],[\"$\",\"div\",null,{\"className\":\"relative mx-auto grid max-w-7xl gap-12 py-16 md:grid-cols-12 md:gap-8\",\"children\":[[\"$\",\"div\",null,{\"className\":\"md:col-span-5\",\"children\":[[\"$\",\"$La\",null,{\"href\":\"/\",\"className\":\"inline-flex items-center gap-2.5 text-ink\",\"aria-label\":\"void home\",\"children\":[\"$L1c\",\"$L1d\"]}],\"$L1e\",\"$L1f\"]}],[\"$L20\",\"$L21\",\"$L22\"]]}],\"$L23\",\"$L24\"]}]],[]],\"forbidden\":\"$undefined\",\"unauthorized\":\"$undefined\"}]}],\"$L25\",\"$L26\"]]}]\n11:[\"$\",\"$1\",\"c\",{\"children\":[null,[\"$\",\"$L5\",null,{\"parallelRouterKey\":\"children\",\"error\":\"$undefined\",\"errorStyles\":\"$undefined\",\"errorScripts\":\"$undefined\",\"template\":[\"$\",\"$L6\",null,{}],\"templateStyles\":\"$undefined\",\"templateScripts\":\"$undefined\",\"notFound\":\"$undefined\",\"forbidden\":\"$undefined\",\"unauthorized\":\"$undefined\"}]]}]\n12:[\"$\",\"$1\",\"c\",{\"children\":[null,[\"$\",\"$L5\",null,{\"parallelRouterKey\":\"children\",\"error\":\"$undefined\",\"errorStyles\":\"$undefined\",\"errorScripts\":\"$undefined\",\"template\":[\"$\",\"$L6\",null,{}],\"templateStyles\":\"$undefined\",\"templateScripts\":\"$undefined\",\"notFound\":\"$undefined\",\"forbidden\":\"$undefined\",\"unauthorized\":\"$undefined\"}]]}]\n13:[\"$\",\"$1\",\"c\",{\"children\":[null,[\"$\",\"$L5\",null,{\"parallelRouterKey\":\"children\",\"error\":\"$undefined\",\"errorStyles\":\"$undefined\",\"errorScripts\":\"$undefined\",\"template\":[\"$\",\"$L6\",null,{}],\"templateStyles\":\"$undefined\",\"templateScripts\":\"$undefined\",\"notFound\":\"$undefined\",\"forbidden\":\"$undefined\",\"unauthorized\":\"$undefined\"}]]}]\n14:[\"$\",\"$1\",\"c\",{\"children\":[\"$L27\",[[\"$\",\"script\",\"script-0\",{\"src\":\"/_next/static/immutable/chunks/10-jx0r2jtr5s.js\",\"async\":true,\"nonce\":\"$undefined\"}],[\"$\",\"script\",\"script-1\",{\"src\":\"/_next/static/immutable/chunks/2-9e3j82g4al3.js\",\"async\":true,\"nonce\":\"$undefined\"}],[\"$\",\"script\",\"script-2\",{\"src\":\"/_next/static/immutable/chunks/15spxoq7fze2b.js\",\"async\":true,\"nonce\":\"$undefined\"}]],[\"$\",\"$L28\",null,{\"children\":[\"$\",\"$29\",null,{\"name\":\"Next.MetadataOutlet\",\"children\":\"$@2a\"}]}]]}]\n16:[\"$\",\"$1\",\"h\",{\"children\":[null,[\"$\",\"$L2b\",null,{\"children\":\"$L2c\"}],[\"$\",\"div\",null,{\"hidden\":true,\"children\":[\"$\",\"$L2d\",null,{\"children\":[\"$\",\"$29\",null,{\"name\":\"Next.Metadata\",\"children\":\"$L2e\"}]}]}],[\"$\",\"meta\",null,{\"name\":\"next-size-adjust\",\"content\":\"\"}]]}]\n18:[\"$\",\"link\",\"0\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/immutable/chunks/2mzoeot222o9m.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\",\"nonce\":\"$undefined\"}]\n33:I[5246,[\"/_next/static/immutable/chunks/3kyyc8_ntqnp4.js\",\"/_next/static/immutable/chunks/0bbcxmn-vo11k.js\"],\"CopyDelegate\"]\n15:C\n1a:[\"$\",\"li\",\"https://parthkapoor.me\",{\"children\":[\"$\",\"a\",null,{\"href\":\"https://parthkapoor.me\",\"rel\":\"noopener noreferrer\",\"className\":\"inline-flex min-h-6 items-center text-sm text-mute transition-colors hover:text-ink\",\"children\":\"Parth Kapoor\"}]}]\n1c:[\"$\",\"$L19\",null,{\"className\":\"size-6\"}]\n1d:[\"$\",\"span\",null,{\"className\":\"text-lg font-medium tracking-tight\",\"children\":\"void\"}]\n1e:[\"$\",\"p\",null,{\"className\":\"mt-4 max-w-[44ch] text-mute\",\"children\":\"A design system for AI coding agents. This site is built with it and audited by it on every change.\"}]\n1f:[\"$\",\"p\",null,{\"className\":\"mt-6 inline-flex flex-wrap items-center gap-x-4 gap-y-1 rounded-full border border-line-2 bg-black/40 px-4 py-2 font-mono text-xs text-mute\",\"children\":[[\"$\",\"span\",null,{\"className\":\"text-flare-2\",\"children\":\"void audit\"}],[[\"$\",\"span\",\"perf\",{\"children\":[\"perf\",\" \",[\"$\",\"span\",null,{\"className\":\"text-ink tabular-nums\",\"children\":\"100\"}]]}],[\"$\",\"span\",\"a11y\",{\"children\":[\"a11y\",\" \",[\"$\",\"span\",null,{\"className\":\"text-ink tabular-nums\",\"children\":\"100\"}]]}],[\"$\",\"span\",\"seo\",{\"children\":[\"seo\",\" \",[\"$\",\"span\",null,{\"className\":\"text-ink tabular-nums\",\"children\":\"99\"}]]}],[\"$\",\"span\",\"geo\",{\"children\":[\"geo\",\" \",[\"$\",\"span\",null,{\"className\":\"text-ink tabular-nums\",\"children\":\"100\"}]]}]]]}]\n20:[\"$\",\"nav\",\"Product\",{\"aria-label\":\"Product\",\"className\":\"md:col-span-2 md:first-of-type:col-start-7\",\"children\":[[\"$\",\"p\",null,{\"className\":\"kicker\",\"children\":\"Product\"}],[\"$\",\"ul\",null,{\"className\":\"mt-4 grid gap-2\",\"children\":[[\"$\",\"li\",\"/docs\",{\"children\":[\"$\",\"$La\",null,{\"href\":\"/docs\",\"className\":\"inline-flex min-h-6 items-center text-sm text-mute transition-colors hover:text-ink\",\"children\":\"Docs\"}]}],[\"$\",\"li\",\"/cli\",{\"children\":[\"$\",\"$La\",null,{\"href\":\"/cli\",\"className\":\"inline-flex min-h-6 items-center text-sm text-mute transition-colors hover:text-ink\",\"children\":\"CLI reference\"}]}],[\"$\",\"li\",\"/rules\",{\"children\":[\"$\",\"$La\",null,{\"href\":\"/rules\",\"className\":\"inline-flex min-h-6 items-center text-sm text-mute transition-colors hover:text-ink\",\"children\":\"Rules\"}]}],[\"$\",\"li\",\"/directions\",{\"children\":[\"$\",\"$La\",null,{\"href\":\"/directions\",\"className\":\"inline-flex min-h-6 items-center text-sm text-mute transition-colors hover:text-ink\",\"children\":\"Directions\"}]}],[\"$\",\"li\",\"/evals\",{\"children\":[\"$\",\"$La\",null,{\"href\":\"/evals\",\"className\":\"inline-flex min-h-6 items-center text-sm text-mute transition-colors hover:text-ink\",\"children\":\"Evals\"}]}]]}]]}]\n21:[\"$\",\"nav\",\"For agents\",{\"aria-label\":\"For agents\",\"className\":\"md:col-span-2 md:first-of-type:col-start-7\",\"children\":[[\"$\",\"p\",null,{\"className\":\"kicker\",\"children\":\"For agents\"}],[\"$\",\"ul\",null,{\"className\":\"mt-4 grid gap-2\",\"children\":[[\"$\",\"li\",\"/llms.txt\",{\"children\":[\"$\",\"a\",null,{\"href\":\"/llms.txt\",\"className\":\"inline-flex min-h-6 items-center text-sm text-mute transition-colors hover:text-ink\",\"children\":\"llms.txt\"}]}],[\"$\",\"li\",\"/llms-full.txt\",{\"children\":[\"$\",\"a\",null,{\"href\":\"/llms-full.txt\",\"className\":\"inline-flex min-h-6 items-center text-sm text-mute transition-colors hover:text-ink\",\"children\":\"llms-full.txt\"}]}],[\"$\",\"li\",\"/index.md\",{\"children\":[\"$\",\"a\",null,{\"href\":\"/index.md\",\"className\":\"inline-flex min-h-6 items-center text-sm text-mute transition-colors hover:text-ink\",\"children\":\"index.md\"}]}],[\"$\",\"li\",\"/sitemap.xml\",{\"children\":[\"$\",\"a\",null,{\"href\":\"/sitemap.xml\",\"className\":\"inline-flex min-h-6 items-center text-sm text-mute transition-colors hover:text-ink\",\"children\":\"sitemap.xml\"}]}]]}]]}]\n22:[\"$\",\"nav\",\"Source\",{\"aria-label\":\"Source\",\"className\":\"md:col-span-2 md:first-of-type:col-start-7\",\"children\":[[\"$\",\"p\",null,{\"className\":\"kicker\",\"children\":\"Source\"}],[\"$\",\"ul\",null,{\"className\":\"mt-4 grid gap-2\",\"children\":[[\"$\",\"li\",\"https://github.com/ParthKapoor-dev/design\",{\"children\":[\"$\",\"a\",null,{\"href\":\"https://github.com/ParthKapoor-dev/design\",\"rel\":\"noopener noreferrer\",\"className\":\"inline-flex min-h-6 items-center text-sm text-mute transition-colors hover:text-ink\",\"children\":\"GitHub\"}]}],[\"$\",\"li\",\"https://github.com/ParthKapoor-dev/design/blob/main/LICENSE\",{\"children\":[\"$\",\"a\",null,{\"href\":\"https://github.com/ParthKapoor-dev/design/blob/main/LICENSE\",\"rel\":\"noopener noreferrer\",\"className\":\"inline-flex min-h-6 items-center text-sm text-mute transition-colors hover:text-ink\",\"children\":\"MIT licence\"}]}],[\"$\",\"li\",\"https://parthkapoor.me\",{\"children\":[\"$\",\"a\",null,{\"href\":\"https://parthkapoor.me\",\"rel\":\"noopener noreferrer\",\"className\":\"inline-flex min-h-6 items-center text-sm text-mute transition-colors hover:text-ink\",\"children\":\"Parth Kapoor\"}]}]]}]]}]\n23:[\"$\",\"p\",null,{\"aria-hidden\":\"true\",\"className\":\"wordmark relative mx-auto max-w-7xl select-none text-center font-semibold leading-[0.72] tracking-[-0.06em] text-[clamp(6rem,24vw,22rem)]\",\"children\":\"void\"}]\n24:[\"$\",\"div\",null,{\"className\":\"relative mx-auto flex max-w-7xl flex-wrap items-center justify-between gap-4 border-t border-line py-6 font-mono text-xs text-mute\",\"children\":[[\"$\",\"span\",null,{\"children\":[\"© 2026 \",\"Parth Kapoor\",\" · \",\"MIT\"]}],[\"$\",\"$L1b\",null,{\"size\":\"sm\"}],[\"$\",\"span\",null,{\"children\":\"void-design.vercel.app\"}]]}]\n25:[\"$\",\"footer\",null,{\"className\":\"relative mt-24 overflow-hidden border-t border-line px-(--gutter)\",\"children\":[[\"$\",\"div\",null,{\"aria-hidden\":\"true\",\"className\":\"pointer-events-none absolute -bottom-[40vw] left-1/2 size-[80vw] -translate-x-1/2 rounded-full bg-[radial-gradient(closest-side,color-mix(in_oklab,var(--flare)_12%,transparent),transparent)]\"}],[\"$\",\"div\",null,{\"className\":\"relative mx-auto grid max-w-7xl gap-12 py-16 md:grid-cols-12 md:gap-8\",\"children\":[[\"$\",\"div\",null,{\"className\":\"md:col-span-5\",\"children\":[[\"$\",\"$La\",null,{\"href\":\"/\",\"className\":\"inline-flex items-center gap-2.5 text-ink\",\"aria-label\":\"void home\",\"children\":[[\"$\",\"$L19\",null,{\"className\":\"size-6\"}],[\"$\",\"span\",null,{\"className\":\"text-lg font-medium tracking-tight\",\"children\":\"void\"}]]}],[\"$\",\"p\",null,{\"className\":\"mt-4 max-w-[44ch] text-mute\",\"children\":\"A design system for AI coding agents. This site is built with it and audited by it on every change.\"}],[\"$\",\"p\",null,{\"className\":\"mt-6 inline-flex flex-wrap items-center gap-x-4 gap-y-1 rounded-full border border-line-2 bg-black/40 px-4 py-2 font-mono text-xs text-mute\",\"children\":[[\"$\",\"span\",null,{\"className\":\"text-flare-2\",\"children\":\"void audit\"}],[[\"$\",\"span\",\"perf\",{\"children\":[\"perf\",\" \",[\"$\",\"span\",null,{\"className\":\"text-ink tabular-nums\",\"children\":\"100\"}]]}],[\"$\",\"span\",\"a11y\",{\"children\":[\"a11y\",\" \",[\"$\",\"span\",null,{\"className\":\"text-ink tabular-nums\",\"children\":\"100\"}]]}],[\"$\",\"span\",\"seo\",{\"children\":[\"seo\",\" \",[\"$\",\"span\",null,{\"className\":\"text-ink tabular-nums\",\"children\":\"99\"}]]}],[\"$\",\"span\",\"geo\",{\"children\":[\"geo\",\" \",[\"$\",\"span\",null,{\"className\":\"text-ink tabular-nums\",\"children\":\"100\"}]]}]]]}]]}],[[\"$\",\"nav\",\"Product\",{\"aria-label\":\"Product\",\"className\":\"md:col-span-2 md:first-of-type:col-start-7\",\"children\":[[\"$\",\"p\",null,{\"className\":\"kicker\",\"children\":\"Product\"}],[\"$\",\"ul\",null,{\"className\":\"mt-4 grid gap-2\",\"children\":[[\"$\",\"li\",\"/docs\",{\"children\":[\"$\",\"$La\",null,{\"href\":\"/docs\",\"className\":\"inline-flex min-h-6 items-center text-sm text-mute transition-colors hover:text-ink\",\"children\":\"Docs\"}]}],[\"$\",\"li\",\"/cli\",{\"children\":[\"$\",\"$La\",null,{\"href\":\"/cli\",\"className\":\"inline-flex min-h-6 items-center text-sm text-mute transition-colors hover:text-ink\",\"children\":\"CLI reference\"}]}],[\"$\",\"li\",\"/rules\",{\"children\":[\"$\",\"$La\",null,{\"href\":\"/rules\",\"className\":\"inline-flex min-h-6 items-center text-sm text-mute transition-colors hover:text-ink\",\"children\":\"Rules\"}]}],[\"$\",\"li\",\"/directions\",{\"children\":[\"$\",\"$La\",null,{\"href\":\"/directions\",\"className\":\"inline-flex min-h-6 items-center text-sm text-mute transition-colors hover:text-ink\",\"children\":\"Directions\"}]}],[\"$\",\"li\",\"/evals\",{\"children\":[\"$\",\"$La\",null,{\"href\":\"/evals\",\"className\":\"inline-flex min-h-6 items-center text-sm text-mute transition-colors hover:text-ink\",\"children\":\"Evals\"}]}]]}]]}],[\"$\",\"nav\",\"For agents\",{\"aria-label\":\"For agents\",\"className\":\"md:col-span-2 md:first-of-type:col-start-7\",\"children\":[[\"$\",\"p\",null,{\"className\":\"kicker\",\"children\":\"For agents\"}],[\"$\",\"ul\",null,{\"className\":\"mt-4 grid gap-2\",\"children\":[[\"$\",\"li\",\"/llms.txt\",{\"children\":[\"$\",\"a\",null,{\"href\":\"/llms.txt\",\"className\":\"inline-flex min-h-6 items-center text-sm text-mute transition-colors hover:text-ink\",\"children\":\"llms.txt\"}]}],[\"$\",\"li\",\"/llms-full.txt\",{\"children\":[\"$\",\"a\",null,{\"href\":\"/llms-full.txt\",\"className\":\"inline-flex min-h-6 items-center text-sm text-mute transition-colors hover:text-ink\",\"children\":\"llms-full.txt\"}]}],[\"$\",\"li\",\"/index.md\",{\"children\":[\"$\",\"a\",null,{\"href\":\"/index.md\",\"className\":\"inline-flex min-h-6 items-center text-sm text-mute transition-colors hover:text-ink\",\"children\":\"index.md\"}]}],[\"$\",\"li\",\"/sitemap.xml\",{\"children\":[\"$\",\"a\",null,{\"href\":\"/sitemap.xml\",\"className\":\"inline-flex min-h-6 items-center text-sm text-mute transition-colors hover:text-ink\",\"children\":\"sitemap.xml\"}]}]]}]]}],[\"$\",\"nav\",\"Source\",{\"aria-label\":\"Source\",\"className\":\"md:col-span-2 md:first-of-type:col-start-7\",\"children\":[[\"$\",\"p\",null,{\"className\":\"kicker\",\"children\":\"Source\"}],[\"$\",\"ul\",null,{\"className\":\"mt-4 grid gap-2\",\"children\":[[\"$\",\"li\",\"https://github.com/ParthKapoor-dev/design\",{\"children\":[\"$\",\"a\",null,{\"href\":\"https://github.com/ParthKapoor-dev/design\",\"rel\":\"noopener noreferrer\",\"className\":\"inline-flex min-h-6 items-center text-sm text-mute transition-colors hover:text-ink\",\"children\":\"GitHub\"}]}],\"$L2f\",\"$L30\"]}]]}]]]}],\"$L31\",\"$L32\"]}]\n26:[\"$\",\"$L33\",null,{}]\n2f:[\"$\",\"li\",\"https://github.com/ParthKapoor-dev/design/blob/main/LICENSE\",{\"children\":[\"$\",\"a\",null,{\"href\":\"https://github.com/ParthKapoor-dev/design/blob/main/LICENSE\",\"rel\":\"noopener noreferrer\",\"className\":\"inline-flex min-h-6 items-center text-sm text-mute transition-colors hover:text-ink\",\"children\":\"MIT licence\"}]}]\n30:[\"$\",\"li\",\"https://parthkapoor.me\",{\"children\":[\"$\",\"a\",null,{\"href\":\"https://parthkapoor.me\",\"rel\":\"noopener noreferrer\",\"className\":\"inline-flex min-h-6 items-center text-sm text-mute transition-colors hover:text-ink\",\"children\":\"Parth Kapoor\"}]}]\n31:[\"$\",\"p\",null,{\"aria-hidden\":\"true\",\"className\":\"wordmark relative mx-auto max-w-7xl select-none text-center font-semibold leading-[0.72] tracking-[-0.06em] text-[clamp(6rem,24vw,22rem)]\",\"children\":\"void\"}]\n32:[\"$\",\"div\",null,{\"className\":\"relative mx-auto flex max-w-7xl flex-wrap items-center justify-between gap-4 border-t border-line py-6 font-mono text-xs text-mute\",\"children\":[[\"$\",\"span\",null,{\"children\":[\"© 2026 \",\"Parth Kapoor\",\" · \",\"MIT\"]}],[\"$\",\"$L1b\",null,{\"size\":\"sm\"}],[\"$\",\"span\",null,{\"children\":\"void-design.vercel.app\"}]]}]\n35:I[50835,[\"/_next/static/immutable/chunks/3kyyc8_ntqnp4.js\",\"/_next/static/immutable/chunks/0bbcxmn-vo11k.js\",\"/_next/static/immutable/chunks/10-jx0r2jtr5s.js\",\"/_next/static/immutable/chunks/2-9e3j82g4al3.js\",\"/_next/static/immutable/chunks/15spxoq7fze2b.js\"],\"DocsNav\"]\n34:T63b,{\"@context\":\"https://schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https://void-design.vercel.app/docs/craft/anti-slop#webpage\",\"url\":\"https://void-design.vercel.app/docs/craft/anti-slop\",\"name\":\"Anti-slop: 30 tells with before/after (craft)\",\"description\":\"Each tell reads as \\\"generated\\\" because the measured top sites don't do it. Numbers are from the 24-site teardown (2026-09-15).\",\"isPartOf\":{\"@id\":\"https://void-design.vercel.app/#website\"},\"inLanguage\":\"en\",\"dateModified\":\"2026-09-16\"},{\"@type\":\"TechArticle\",\"@id\":\"https://void-design.vercel.app/docs/craft/anti-slop#article\",\"headline\":\"Anti-slop: 30 tells with before/after (craft)\",\"description\":\"Each tell reads as \\\"generated\\\" because the measured top sites don't do it. Numbers are from the 24-site teardown (2026-09-15).\",\"datePublished\":\"2026-09-16\",\"dateModified\":\"2026-09-16\",\"mainEntityOfPage\":{\"@id\":\"https://void-design.vercel.app/docs/craft/anti-slop#webpage\"},\"author\":{\"@id\":\"https://void-design.vercel.app/#organization\"},\"publisher\":{\"@id\":\"https://void-design.vercel.app/#organization\"},\"image\":[\"https://void-design.vercel.app/docs/craft/anti-slop/opengraph-image\"]},{\"@type\":\"BreadcrumbList\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"void\",\"item\":\"https://void-design.vercel.app/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"docs\",\"item\":\"https://void-design.vercel.app/docs\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"craft\",\"item\":\"https://void-design.vercel.app/docs/craft\"},{\"@type\":\"ListItem\",\"position\":4,\"name\":\"anti-slop\",\"item\":\"https://void-design.vercel.app/docs/craft/anti-slop\"}]}]}27:[\"$\",\"div\",null,{\"className\":\"px-(--gutter)\",\"children\":[[\"$\",\"script\",null,{\"type\":\"application/ld+json\",\"dangerouslySetInnerHTML\":{\"__html\":\"$34\"}}],[\"$\",\"$L9\",null,{\"crumbs\":[{\"name\":\"void\",\"path\":\"/\"},{\"name\":\"docs\",\"path\":\"/docs\"},{\"name\":\"craft\",\"path\":\"/docs/craft\"},{\"name\":\"anti-slop\",\"path\":\"/docs/craft/anti-slop\"}],\"kicker\":\"Reference · craft\",\"title\":[\"$\",\"span\",null,{\"className\":\"block text-[clamp(2.4rem,5.6vw,5.8rem)] leading-[0.95]\",\"children\":\"Anti-slop: 30 tells with before/after\"}],\"lead\":\"$undefined\",\"meta\":[[\"$\",\"span\",null,{\"children\":\"craft/references/anti-slop.md\"}],[\"$\",\"span\",null,{\"children\":[169,\" lines\"]}],[\"$\",\"span\",null,{\"children\":[\"updated \",\"16 Sept 2026\"]}]],\"scene\":\"ether\"}],[\"$\",\"div\",null,{\"className\":\"mx-auto grid max-w-7xl gap-x-12 lg:grid-cols-[13rem_minmax(0,1fr)] xl:grid-cols-[13rem_minmax(0,1fr)_12rem]\",\"children\":[[\"$\",\"div\",null,{\"className\":\"lg:hidden\",\"children\":[\"$\",\"button\",null,{\"type\":\"button\",\"popoverTarget\":\"docs-nav\",\"className\":\"flex h-11 w-full items-center gap-2.5 rounded-xl border border-line bg-bg-subtle px-4 text-sm text-fg transition-colors hover:border-line-strong\",\"children\":[[\"$\",\"svg\",null,{\"aria-hidden\":true,\"viewBox\":\"0 0 16 16\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":1.5,\"className\":\"size-4 text-fg-muted\",\"children\":[\"$\",\"path\",null,{\"d\":\"M2.5 5.5h11M2.5 10.5h11\",\"strokeLinecap\":\"round\"}]}],\"Browse docs\"]}]}],[\"$\",\"aside\",null,{\"id\":\"docs-nav\",\"aria-label\":\"Documentation sections\",\"popover\":\"auto\",\"data-lenis-prevent\":true,\"className\":\"docs-aside m-0 max-h-[80dvh] w-[min(20rem,calc(100vw-2rem))] overflow-y-auto overscroll-contain rounded-2xl border border-line bg-surface-raised p-5 text-fg shadow-3 [scrollbar-color:var(--line-strong)_transparent] [scrollbar-width:thin]\",\"children\":[\"$\",\"$L35\",null,{\"groups\":[{\"title\":\"Start\",\"items\":[{\"href\":\"/docs\",\"label\":\"Getting started\"},{\"href\":\"/cli\",\"label\":\"CLI reference\"},{\"href\":\"/rules\",\"label\":\"Rules\"},{\"href\":\"/directions\",\"label\":\"Directions\"}]},{\"title\":\"Skills\",\"items\":[{\"href\":\"/docs/website\",\"label\":\"website\"},{\"href\":\"/docs/website/copy-and-content\",\"label\":\"copy and content\",\"parent\":\"/docs/website\"},{\"href\":\"/docs/website/page-types\",\"label\":\"page types\",\"parent\":\"/docs/website\"},{\"href\":\"/docs/website/section-archetypes\",\"label\":\"section archetypes\",\"parent\":\"/docs/website\"},{\"href\":\"/docs/craft\",\"label\":\"craft\"},{\"href\":\"/docs/craft/anti-slop\",\"label\":\"anti slop\",\"parent\":\"/docs/craft\"},{\"href\":\"/docs/craft/color\",\"label\":\"color\",\"parent\":\"/docs/craft\"},{\"href\":\"/docs/craft/depth-and-detail\",\"label\":\"depth and detail\",\"parent\":\"/docs/craft\"},{\"href\":\"/docs/craft/directions\",\"label\":\"directions\",\"parent\":\"/docs/craft\"},{\"href\":\"/docs/craft/layout\",\"label\":\"layout\",\"parent\":\"/docs/craft\"},{\"href\":\"/docs/craft/tailwind-v4\",\"label\":\"tailwind v4\",\"parent\":\"/docs/craft\"},{\"href\":\"/docs/craft/typography\",\"label\":\"typography\",\"parent\":\"/docs/craft\"},{\"href\":\"/docs/motion\",\"label\":\"motion\"},{\"href\":\"/docs/motion/3d-scenes\",\"label\":\"3d scenes\",\"parent\":\"/docs/motion\"},{\"href\":\"/docs/motion/CREDITS\",\"label\":\"CREDITS\",\"parent\":\"/docs/motion\"},{\"href\":\"/docs/motion/backgrounds\",\"label\":\"backgrounds\",\"parent\":\"/docs/motion\"},{\"href\":\"/docs/motion/fallbacks\",\"label\":\"fallbacks\",\"parent\":\"/docs/motion\"},{\"href\":\"/docs/motion/recipes\",\"label\":\"recipes\",\"parent\":\"/docs/motion\"},{\"href\":\"/docs/motion/timing\",\"label\":\"timing\",\"parent\":\"/docs/motion\"},{\"href\":\"/docs/motion/webgl-canvas\",\"label\":\"webgl canvas\",\"parent\":\"/docs/motion\"},{\"href\":\"/docs/components\",\"label\":\"components\"},{\"href\":\"/docs/components/audit-checklist\",\"label\":\"audit checklist\",\"parent\":\"/docs/components\"},{\"href\":\"/docs/components/catalogue\",\"label\":\"catalogue\",\"parent\":\"/docs/components\"},{\"href\":\"/docs/components/recipes\",\"label\":\"recipes\",\"parent\":\"/docs/components\"},{\"href\":\"/docs/components/upstream-bugs\",\"label\":\"upstream bugs\",\"parent\":\"/docs/components\"},{\"href\":\"/docs/inspire\",\"label\":\"inspire\"},{\"href\":\"/docs/inspire/effect-downgrades\",\"label\":\"effect downgrades\",\"parent\":\"/docs/inspire\"},{\"href\":\"/docs/inspire/extraction-guide\",\"label\":\"extraction guide\",\"parent\":\"/docs/inspire\"},{\"href\":\"/docs/inspire/font-alternatives\",\"label\":\"font alternatives\",\"parent\":\"/docs/inspire\"},{\"href\":\"/docs/speed\",\"label\":\"speed\"},{\"href\":\"/docs/speed/images-fonts\",\"label\":\"images fonts\",\"parent\":\"/docs/speed\"},{\"href\":\"/docs/speed/next-performance\",\"label\":\"next performance\",\"parent\":\"/docs/speed\"},{\"href\":\"/docs/speed/react-pitfalls\",\"label\":\"react pitfalls\",\"parent\":\"/docs/speed\"},{\"href\":\"/docs/speed/rendering-smoothness\",\"label\":\"rendering smoothness\",\"parent\":\"/docs/speed\"},{\"href\":\"/docs/seo\",\"label\":\"seo\"},{\"href\":\"/docs/seo/ai-crawlers\",\"label\":\"ai crawlers\",\"parent\":\"/docs/seo\"},{\"href\":\"/docs/seo/content-for-citation\",\"label\":\"content for citation\",\"parent\":\"/docs/seo\"},{\"href\":\"/docs/seo/llms-txt-markdown\",\"label\":\"llms txt markdown\",\"parent\":\"/docs/seo\"},{\"href\":\"/docs/seo/next-metadata\",\"label\":\"next metadata\",\"parent\":\"/docs/seo\"},{\"href\":\"/docs/seo/structured-data\",\"label\":\"structured data\",\"parent\":\"/docs/seo\"},{\"href\":\"/docs/a11y\",\"label\":\"a11y\"},{\"href\":\"/docs/a11y/patterns\",\"label\":\"patterns\",\"parent\":\"/docs/a11y\"},{\"href\":\"/docs/audit\",\"label\":\"audit\"},{\"href\":\"/docs/audit/ci\",\"label\":\"ci\",\"parent\":\"/docs/audit\"},{\"href\":\"/docs/audit/commands\",\"label\":\"commands\",\"parent\":\"/docs/audit\"}]}]}]}],\"$L36\",\"$L37\"]}]]}]\n38:T7512,\u003cp\u003eEach tell reads as \u0026quot;generated\u0026quot; because the measured top sites don\u0026#39;t do it. Numbers are from the 24-site teardown (2026-09-15). Run this list against screenshots at 1440 and 390.\u003c/p\u003e\n\u003ch2 id=\"color\"\u003e\u003ca class=\"heading-anchor\" href=\"#color\"\u003eColor\u003c/a\u003e\u003c/h2\u003e\n\u003cp\u003e\u003cstrong\u003e1. Purple→blue gradients.\u003c/strong\u003e 0 of 24 sites put a gradient on a CTA or headline at the fold; Stripe\u0026#39;s gradient is an art-directed WebGL ribbon.\u003c/p\u003e\n\u003cfigure class=\"code-block\" data-lang=\"tsx\"\u003e\u003cfigcaption\u003e\u003cspan\u003etsx\u003c/span\u003e\u003cbutton type=\"button\" class=\"copy-button\" data-copy\u003eCopy\u003c/button\u003e\u003c/figcaption\u003e\u003cpre tabindex=\"0\" aria-label=\"tsx code\" class=\"shiki void\" style=\"background-color:var(--shiki-background);color:var(--shiki-foreground)\" tabindex=\"0\"\u003e\u003ccode\u003e\u003cspan class=\"line\"\u003e\u003cspan style=\"color:var(--shiki-token-comment)\"\u003e// before\u003c/span\u003e\u003c/span\u003e\n\u003cspan class=\"line\"\u003e\u003cspan style=\"color:var(--shiki-foreground)\"\u003e\u0026#x3C;\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-string-expression)\"\u003ea\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-function)\"\u003e className\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-keyword)\"\u003e=\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-string-expression)\"\u003e\"bg-gradient-to-r from-indigo-500 to-purple-600 text-white shadow-lg\"\u003c/span\u003e\u003cspan style=\"color:var(--shiki-foreground)\"\u003e\u003eGet started\u0026#x3C;/\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-string-expression)\"\u003ea\u003c/span\u003e\u003cspan style=\"color:var(--shiki-foreground)\"\u003e\u003e\u003c/span\u003e\u003c/span\u003e\n\u003cspan class=\"line\"\u003e\u003cspan style=\"color:var(--shiki-token-comment)\"\u003e// after\u003c/span\u003e\u003c/span\u003e\n\u003cspan class=\"line\"\u003e\u003cspan style=\"color:var(--shiki-foreground)\"\u003e\u0026#x3C;\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-constant)\"\u003eButton\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-function)\"\u003e href\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-keyword)\"\u003e=\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-string-expression)\"\u003e\"/signup\"\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-function)\"\u003e size\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-keyword)\"\u003e=\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-string-expression)\"\u003e\"lg\"\u003c/span\u003e\u003cspan style=\"color:var(--shiki-foreground)\"\u003e\u003eStart free trial\u0026#x3C;/\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-constant)\"\u003eButton\u003c/span\u003e\u003cspan style=\"color:var(--shiki-foreground)\"\u003e\u003e \u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-comment)\"\u003e// bg-brand, flat, inset highlight\u003c/span\u003e\u003c/span\u003e\u003c/code\u003e\u003c/pre\u003e\u003c/figure\u003e\n\u003cp\u003e\u003cstrong\u003e2. Gradient headline text.\u003c/strong\u003e (\u003ca class=\"code-link\" href=\"/rules/design/gradient-text\"\u003e\u003ccode\u003edesign/gradient-text\u003c/code\u003e\u003c/a\u003e)\u003c/p\u003e\n\u003cfigure class=\"code-block\" data-lang=\"tsx\"\u003e\u003cfigcaption\u003e\u003cspan\u003etsx\u003c/span\u003e\u003cbutton type=\"button\" class=\"copy-button\" data-copy\u003eCopy\u003c/button\u003e\u003c/figcaption\u003e\u003cpre tabindex=\"0\" aria-label=\"tsx code\" class=\"shiki void\" style=\"background-color:var(--shiki-background);color:var(--shiki-foreground)\" tabindex=\"0\"\u003e\u003ccode\u003e\u003cspan class=\"line\"\u003e\u003cspan style=\"color:var(--shiki-token-comment)\"\u003e// before\u003c/span\u003e\u003c/span\u003e\n\u003cspan class=\"line\"\u003e\u003cspan style=\"color:var(--shiki-foreground)\"\u003e\u0026#x3C;\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-string-expression)\"\u003eh1\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-function)\"\u003e className\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-keyword)\"\u003e=\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-string-expression)\"\u003e\"bg-gradient-to-r from-sky-400 to-fuchsia-500 bg-clip-text text-transparent\"\u003c/span\u003e\u003cspan style=\"color:var(--shiki-foreground)\"\u003e\u003eThe future of work\u0026#x3C;/\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-string-expression)\"\u003eh1\u003c/span\u003e\u003cspan style=\"color:var(--shiki-foreground)\"\u003e\u003e\u003c/span\u003e\u003c/span\u003e\n\u003cspan class=\"line\"\u003e\u003cspan style=\"color:var(--shiki-token-comment)\"\u003e// after\u003c/span\u003e\u003c/span\u003e\n\u003cspan class=\"line\"\u003e\u003cspan style=\"color:var(--shiki-foreground)\"\u003e\u0026#x3C;\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-string-expression)\"\u003eh1\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-function)\"\u003e className\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-keyword)\"\u003e=\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-string-expression)\"\u003e\"max-w-[16ch] text-display-lg text-fg\"\u003c/span\u003e\u003cspan style=\"color:var(--shiki-foreground)\"\u003e\u003eStandups in 4 minutes. \u0026#x3C;\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-string-expression)\"\u003espan\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-function)\"\u003e className\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-keyword)\"\u003e=\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-string-expression)\"\u003e\"text-fg-muted\"\u003c/span\u003e\u003cspan style=\"color:var(--shiki-foreground)\"\u003e\u003eWritten by the tickets.\u0026#x3C;/\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-string-expression)\"\u003espan\u003c/span\u003e\u003cspan style=\"color:var(--shiki-foreground)\"\u003e\u003e\u0026#x3C;/\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-string-expression)\"\u003eh1\u003c/span\u003e\u003cspan style=\"color:var(--shiki-foreground)\"\u003e\u003e\u003c/span\u003e\u003c/span\u003e\u003c/code\u003e\u003c/pre\u003e\u003c/figure\u003e\n\u003cp\u003e\u003cstrong\u003e3. Rainbow accents.\u003c/strong\u003e Measured accent use ≤ 5% of elements, one hue. (\u003ca class=\"code-link\" href=\"/rules/design/multiple-accents\"\u003e\u003ccode\u003edesign/multiple-accents\u003c/code\u003e\u003c/a\u003e)\u003c/p\u003e\n\u003cfigure class=\"code-block\" data-lang=\"tsx\"\u003e\u003cfigcaption\u003e\u003cspan\u003etsx\u003c/span\u003e\u003cbutton type=\"button\" class=\"copy-button\" data-copy\u003eCopy\u003c/button\u003e\u003c/figcaption\u003e\u003cpre tabindex=\"0\" aria-label=\"tsx code\" class=\"shiki void\" style=\"background-color:var(--shiki-background);color:var(--shiki-foreground)\" tabindex=\"0\"\u003e\u003ccode\u003e\u003cspan class=\"line\"\u003e\u003cspan style=\"color:var(--shiki-token-comment)\"\u003e// before: \u0026#x3C;Zap className=\"text-yellow-500\"/\u003e \u0026#x3C;Shield className=\"text-green-500\"/\u003e \u0026#x3C;Globe className=\"text-purple-500\"/\u003e\u003c/span\u003e\u003c/span\u003e\n\u003cspan class=\"line\"\u003e\u003cspan style=\"color:var(--shiki-token-comment)\"\u003e// after: every icon className=\"size-4 text-fg-muted\"; brand only on the CTA and links\u003c/span\u003e\u003c/span\u003e\u003c/code\u003e\u003c/pre\u003e\u003c/figure\u003e\n\u003cp\u003e\u003cstrong\u003e4. Pure black on white + gray-500.\u003c/strong\u003e Foregrounds measured: #171717, #141413, #26251e; backgrounds #fafafa, #faf9f5.\u003c/p\u003e\n\u003cfigure class=\"code-block\" data-lang=\"tsx\"\u003e\u003cfigcaption\u003e\u003cspan\u003etsx\u003c/span\u003e\u003cbutton type=\"button\" class=\"copy-button\" data-copy\u003eCopy\u003c/button\u003e\u003c/figcaption\u003e\u003cpre tabindex=\"0\" aria-label=\"tsx code\" class=\"shiki void\" style=\"background-color:var(--shiki-background);color:var(--shiki-foreground)\" tabindex=\"0\"\u003e\u003ccode\u003e\u003cspan class=\"line\"\u003e\u003cspan style=\"color:var(--shiki-token-comment)\"\u003e// before \u0026#x3C;body className=\"bg-white text-black\"\u003e \u0026#x3C;p className=\"text-gray-500\"\u003e\u003c/span\u003e\u003c/span\u003e\n\u003cspan class=\"line\"\u003e\u003cspan style=\"color:var(--shiki-token-comment)\"\u003e// after (nothing on body: base sets bg-bg text-fg) \u0026#x3C;p className=\"text-fg-muted\"\u003e\u003c/span\u003e\u003c/span\u003e\u003c/code\u003e\u003c/pre\u003e\u003c/figure\u003e\n\u003cp\u003e\u003cstrong\u003e5. Solid gray borders everywhere.\u003c/strong\u003e Measured hairlines are 1px at 5–12% alpha.\u003c/p\u003e\n\u003cfigure class=\"code-block\" data-lang=\"tsx\"\u003e\u003cfigcaption\u003e\u003cspan\u003etsx\u003c/span\u003e\u003cbutton type=\"button\" class=\"copy-button\" data-copy\u003eCopy\u003c/button\u003e\u003c/figcaption\u003e\u003cpre tabindex=\"0\" aria-label=\"tsx code\" class=\"shiki void\" style=\"background-color:var(--shiki-background);color:var(--shiki-foreground)\" tabindex=\"0\"\u003e\u003ccode\u003e\u003cspan class=\"line\"\u003e\u003cspan style=\"color:var(--shiki-token-comment)\"\u003e// before \u0026#x3C;div className=\"border border-gray-200 rounded-2xl shadow-md p-6\"\u003e\u003c/span\u003e\u003c/span\u003e\n\u003cspan class=\"line\"\u003e\u003cspan style=\"color:var(--shiki-token-comment)\"\u003e// after \u0026#x3C;div className=\"rounded-xl border border-line-subtle p-6\"\u003e // or surface-card\u003c/span\u003e\u003c/span\u003e\u003c/code\u003e\u003c/pre\u003e\u003c/figure\u003e\n\u003cp\u003e\u003cstrong\u003e6. Glass cards.\u003c/strong\u003e Blur measured only on headers (Linear 20px, Mercury 10px) and overlays.\u003c/p\u003e\n\u003cfigure class=\"code-block\" data-lang=\"tsx\"\u003e\u003cfigcaption\u003e\u003cspan\u003etsx\u003c/span\u003e\u003cbutton type=\"button\" class=\"copy-button\" data-copy\u003eCopy\u003c/button\u003e\u003c/figcaption\u003e\u003cpre tabindex=\"0\" aria-label=\"tsx code\" class=\"shiki void\" style=\"background-color:var(--shiki-background);color:var(--shiki-foreground)\" tabindex=\"0\"\u003e\u003ccode\u003e\u003cspan class=\"line\"\u003e\u003cspan style=\"color:var(--shiki-token-comment)\"\u003e// before \u0026#x3C;div className=\"backdrop-blur-xl bg-white/10 border border-white/20 rounded-3xl\"\u003e\u003c/span\u003e\u003c/span\u003e\n\u003cspan class=\"line\"\u003e\u003cspan style=\"color:var(--shiki-token-comment)\"\u003e// after \u0026#x3C;div className=\"rounded-xl bg-surface border border-line-subtle\"\u003e\u003c/span\u003e\u003c/span\u003e\u003c/code\u003e\u003c/pre\u003e\u003c/figure\u003e\n\u003cp\u003e\u003cstrong\u003e7. Blob/orb hero.\u003c/strong\u003e\u003c/p\u003e\n\u003cfigure class=\"code-block\" data-lang=\"tsx\"\u003e\u003cfigcaption\u003e\u003cspan\u003etsx\u003c/span\u003e\u003cbutton type=\"button\" class=\"copy-button\" data-copy\u003eCopy\u003c/button\u003e\u003c/figcaption\u003e\u003cpre tabindex=\"0\" aria-label=\"tsx code\" class=\"shiki void\" style=\"background-color:var(--shiki-background);color:var(--shiki-foreground)\" tabindex=\"0\"\u003e\u003ccode\u003e\u003cspan class=\"line\"\u003e\u003cspan style=\"color:var(--shiki-token-comment)\"\u003e// before \u0026#x3C;div className=\"absolute -top-40 left-1/2 size-[600px] rounded-full bg-purple-500/30 blur-3xl\" /\u003e\u003c/span\u003e\u003c/span\u003e\n\u003cspan class=\"line\"\u003e\u003cspan style=\"color:var(--shiki-token-comment)\"\u003e// after one edge light at 12% brand, or none, plus a real product frame or a typographic hero\u003c/span\u003e\u003c/span\u003e\n\u003cspan class=\"line\"\u003e\u003cspan style=\"color:var(--shiki-foreground)\"\u003e\u0026#x3C;\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-string-expression)\"\u003ediv\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-function)\"\u003e aria-hidden\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-function)\"\u003e className\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-keyword)\"\u003e=\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-string-expression)\"\u003e\"pointer-events-none absolute inset-x-0 top-0 -z-10 h-144 bg-[radial-gradient(60%_70%_at_20%_0%,color-mix(in_oklch,var(--brand)_12%,transparent),transparent_70%)]\"\u003c/span\u003e\u003cspan style=\"color:var(--shiki-foreground)\"\u003e /\u003e\u003c/span\u003e\u003c/span\u003e\u003c/code\u003e\u003c/pre\u003e\u003c/figure\u003e\n\u003cp\u003e\u003cstrong\u003e8. Default selection and focus.\u003c/strong\u003e 20/24 sites brand the selection. Fix: don\u0026#39;t override base (\u003ccode\u003e::selection\u003c/code\u003e, \u003ccode\u003e:focus-visible\u003c/code\u003e); delete any \u003ccode\u003eoutline-none\u003c/code\u003e.\u003c/p\u003e\n\u003ch2 id=\"typography\"\u003e\u003ca class=\"heading-anchor\" href=\"#typography\"\u003eTypography\u003c/a\u003e\u003c/h2\u003e\n\u003cp\u003e\u003cstrong\u003e9. Default tracking on big headings.\u003c/strong\u003e 14/18 sites with ≥ 40px display text use negative tracking. (\u003ca class=\"code-link\" href=\"/rules/design/heading-tracking\"\u003e\u003ccode\u003edesign/heading-tracking\u003c/code\u003e\u003c/a\u003e)\u003c/p\u003e\n\u003cfigure class=\"code-block\" data-lang=\"tsx\"\u003e\u003cfigcaption\u003e\u003cspan\u003etsx\u003c/span\u003e\u003cbutton type=\"button\" class=\"copy-button\" data-copy\u003eCopy\u003c/button\u003e\u003c/figcaption\u003e\u003cpre tabindex=\"0\" aria-label=\"tsx code\" class=\"shiki void\" style=\"background-color:var(--shiki-background);color:var(--shiki-foreground)\" tabindex=\"0\"\u003e\u003ccode\u003e\u003cspan class=\"line\"\u003e\u003cspan style=\"color:var(--shiki-token-comment)\"\u003e// before \u0026#x3C;h1 className=\"text-6xl font-bold tracking-normal leading-tight\"\u003e\u003c/span\u003e\u003c/span\u003e\n\u003cspan class=\"line\"\u003e\u003cspan style=\"color:var(--shiki-token-comment)\"\u003e// after \u0026#x3C;h1 className=\"text-display-lg\"\u003e // size, lh 0.96, −0.04em×knob, weight from direction\u003c/span\u003e\u003c/span\u003e\u003c/code\u003e\u003c/pre\u003e\u003c/figure\u003e\n\u003cp\u003e\u003cstrong\u003e10. Bold display.\u003c/strong\u003e 18/23 measured H1s ≤ 600. Remove \u003ccode\u003efont-bold\u003c/code\u003e/\u003ccode\u003efont-extrabold\u003c/code\u003e from headings.\u003c/p\u003e\n\u003cp\u003e\u003cstrong\u003e11. Loose display leading.\u003c/strong\u003e Measured 0.85–1.15. Never \u003ccode\u003eleading-normal\u003c/code\u003e/\u003ccode\u003eleading-relaxed\u003c/code\u003e on \u003ccode\u003etext-display*\u003c/code\u003e.\u003c/p\u003e\n\u003cp\u003e\u003cstrong\u003e12. No small-type texture.\u003c/strong\u003e Workhorse is 14px; mono labels add technical texture.\u003c/p\u003e\n\u003cfigure class=\"code-block\" data-lang=\"tsx\"\u003e\u003cfigcaption\u003e\u003cspan\u003etsx\u003c/span\u003e\u003cbutton type=\"button\" class=\"copy-button\" data-copy\u003eCopy\u003c/button\u003e\u003c/figcaption\u003e\u003cpre tabindex=\"0\" aria-label=\"tsx code\" class=\"shiki void\" style=\"background-color:var(--shiki-background);color:var(--shiki-foreground)\" tabindex=\"0\"\u003e\u003ccode\u003e\u003cspan class=\"line\"\u003e\u003cspan style=\"color:var(--shiki-token-comment)\"\u003e// before \u0026#x3C;p className=\"text-base\"\u003ePipelines\u0026#x3C;/p\u003e\u003c/span\u003e\u003c/span\u003e\n\u003cspan class=\"line\"\u003e\u003cspan style=\"color:var(--shiki-token-comment)\"\u003e// after \u0026#x3C;p className=\"label-mono text-fg-muted\"\u003e01 · Pipelines\u0026#x3C;/p\u003e\u003c/span\u003e\u003c/span\u003e\u003c/code\u003e\u003c/pre\u003e\u003c/figure\u003e\n\u003cp\u003e\u003cstrong\u003e13. Wide grey hero sub.\u003c/strong\u003e Measured max-width 480–672px.\u003c/p\u003e\n\u003cfigure class=\"code-block\" data-lang=\"tsx\"\u003e\u003cfigcaption\u003e\u003cspan\u003etsx\u003c/span\u003e\u003cbutton type=\"button\" class=\"copy-button\" data-copy\u003eCopy\u003c/button\u003e\u003c/figcaption\u003e\u003cpre tabindex=\"0\" aria-label=\"tsx code\" class=\"shiki void\" style=\"background-color:var(--shiki-background);color:var(--shiki-foreground)\" tabindex=\"0\"\u003e\u003ccode\u003e\u003cspan class=\"line\"\u003e\u003cspan style=\"color:var(--shiki-token-comment)\"\u003e// before \u0026#x3C;p className=\"mx-auto max-w-4xl text-xl text-gray-500\"\u003e\u003c/span\u003e\u003c/span\u003e\n\u003cspan class=\"line\"\u003e\u003cspan style=\"color:var(--shiki-token-comment)\"\u003e// after \u0026#x3C;p className=\"mt-6 max-w-[44ch] text-lg text-fg-muted\"\u003e\u003c/span\u003e\u003c/span\u003e\u003c/code\u003e\u003c/pre\u003e\u003c/figure\u003e\n\u003cp\u003e\u003cstrong\u003e14. Orphans.\u003c/strong\u003e Base sets \u003ccode\u003etext-wrap: balance\u003c/code\u003e on h1–h4; also cap width: \u003ccode\u003emax-w-[16ch]\u003c/code\u003e.\u003c/p\u003e\n\u003cp\u003e\u003cstrong\u003e15. Too many fonts.\u003c/strong\u003e ≤ 2 families + mono (\u003ca class=\"code-link\" href=\"/rules/design/too-many-font-families\"\u003e\u003ccode\u003edesign/too-many-font-families\u003c/code\u003e\u003c/a\u003e, \u003ca class=\"code-link\" href=\"/rules/lint/google-fonts-link\"\u003e\u003ccode\u003elint/google-fonts-link\u003c/code\u003e\u003c/a\u003e). Delete \u003ccode\u003e\u003clink href=\"fonts.googleapis.com…\"\u003e\u003c/code\u003e; use the direction\u0026#39;s \u003ccode\u003enext/font\u003c/code\u003e loaders.\u003c/p\u003e\n\u003ch2 id=\"layout\"\u003e\u003ca class=\"heading-anchor\" href=\"#layout\"\u003eLayout\u003c/a\u003e\u003c/h2\u003e\n\u003cp\u003e\u003cstrong\u003e16. Everything centered.\u003c/strong\u003e Interior headings centered: Linear 1/14, Stripe 1/32.\u003c/p\u003e\n\u003cfigure class=\"code-block\" data-lang=\"tsx\"\u003e\u003cfigcaption\u003e\u003cspan\u003etsx\u003c/span\u003e\u003cbutton type=\"button\" class=\"copy-button\" data-copy\u003eCopy\u003c/button\u003e\u003c/figcaption\u003e\u003cpre tabindex=\"0\" aria-label=\"tsx code\" class=\"shiki void\" style=\"background-color:var(--shiki-background);color:var(--shiki-foreground)\" tabindex=\"0\"\u003e\u003ccode\u003e\u003cspan class=\"line\"\u003e\u003cspan style=\"color:var(--shiki-token-comment)\"\u003e// before \u0026#x3C;div className=\"text-center\"\u003e\u0026#x3C;h2\u003e…\u0026#x3C;/h2\u003e\u0026#x3C;p className=\"mx-auto\"\u003e…\u0026#x3C;/p\u003e\u0026#x3C;/div\u003e\u003c/span\u003e\u003c/span\u003e\n\u003cspan class=\"line\"\u003e\u003cspan style=\"color:var(--shiki-token-comment)\"\u003e// after \u0026#x3C;div className=\"grid gap-6 lg:grid-cols-12\"\u003e\u0026#x3C;h2 className=\"lg:col-span-5\"\u003e…\u0026#x3C;/h2\u003e\u0026#x3C;p className=\"lg:col-span-6 lg:col-start-7\"\u003e…\u0026#x3C;/p\u003e\u0026#x3C;/div\u003e\u003c/span\u003e\u003c/span\u003e\u003c/code\u003e\u003c/pre\u003e\u003c/figure\u003e\n\u003cp\u003e\u003cstrong\u003e17. The template page\u003c/strong\u003e (badge → centered H1 → 2 buttons → glow screenshot → 3 icon cards → logos → testimonials → pricing → FAQ → CTA). Fix: plan sections from the brief with archetypes (\u003ca class=\"code-link\" href=\"/docs/website/section-archetypes\"\u003e\u003ccode\u003ewebsite/references/section-archetypes.md\u003c/code\u003e\u003c/a\u003e); each section must have a job.\u003c/p\u003e\n\u003cp\u003e\u003cstrong\u003e18. Three identical icon cards.\u003c/strong\u003e None of the top sites uses it as the primary feature explainer.\u003c/p\u003e\n\u003cfigure class=\"code-block\" data-lang=\"tsx\"\u003e\u003cfigcaption\u003e\u003cspan\u003etsx\u003c/span\u003e\u003cbutton type=\"button\" class=\"copy-button\" data-copy\u003eCopy\u003c/button\u003e\u003c/figcaption\u003e\u003cpre tabindex=\"0\" aria-label=\"tsx code\" class=\"shiki void\" style=\"background-color:var(--shiki-background);color:var(--shiki-foreground)\" tabindex=\"0\"\u003e\u003ccode\u003e\u003cspan class=\"line\"\u003e\u003cspan style=\"color:var(--shiki-token-comment)\"\u003e// before\u003c/span\u003e\u003c/span\u003e\n\u003cspan class=\"line\"\u003e\u003cspan style=\"color:var(--shiki-foreground)\"\u003e\u0026#x3C;\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-string-expression)\"\u003ediv\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-function)\"\u003e className\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-keyword)\"\u003e=\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-string-expression)\"\u003e\"grid grid-cols-3 gap-8\"\u003c/span\u003e\u003cspan style=\"color:var(--shiki-foreground)\"\u003e\u003e{\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-constant)\"\u003efeatures\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-function)\"\u003e.map\u003c/span\u003e\u003cspan style=\"color:var(--shiki-foreground)\"\u003e(f \u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-keyword)\"\u003e=\u003e\u003c/span\u003e\u003cspan style=\"color:var(--shiki-foreground)\"\u003e \u0026#x3C;\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-string-expression)\"\u003ediv\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-function)\"\u003e className\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-keyword)\"\u003e=\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-string-expression)\"\u003e\"rounded-2xl p-8 shadow\"\u003c/span\u003e\u003cspan style=\"color:var(--shiki-foreground)\"\u003e\u003e\u0026#x3C;\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-string-expression)\"\u003ediv\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-function)\"\u003e className\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-keyword)\"\u003e=\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-string-expression)\"\u003e\"size-12 rounded-full bg-indigo-100\"\u003c/span\u003e\u003cspan style=\"color:var(--shiki-foreground)\"\u003e\u003e\u0026#x3C;\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-constant)\"\u003ef.icon\u003c/span\u003e\u003cspan style=\"color:var(--shiki-foreground)\"\u003e/\u003e\u0026#x3C;/\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-string-expression)\"\u003ediv\u003c/span\u003e\u003cspan style=\"color:var(--shiki-foreground)\"\u003e\u003e\u0026#x3C;\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-string-expression)\"\u003eh3\u003c/span\u003e\u003cspan style=\"color:var(--shiki-foreground)\"\u003e\u003e{\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-constant)\"\u003ef\u003c/span\u003e\u003cspan style=\"color:var(--shiki-foreground)\"\u003e.title}\u0026#x3C;/\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-string-expression)\"\u003eh3\u003c/span\u003e\u003cspan style=\"color:var(--shiki-foreground)\"\u003e\u003e\u0026#x3C;\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-string-expression)\"\u003ep\u003c/span\u003e\u003cspan style=\"color:var(--shiki-foreground)\"\u003e\u003e{\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-constant)\"\u003ef\u003c/span\u003e\u003cspan style=\"color:var(--shiki-foreground)\"\u003e.body}\u0026#x3C;/\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-string-expression)\"\u003ep\u003c/span\u003e\u003cspan style=\"color:var(--shiki-foreground)\"\u003e\u003e\u0026#x3C;/\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-string-expression)\"\u003ediv\u003c/span\u003e\u003cspan style=\"color:var(--shiki-foreground)\"\u003e\u003e)}\u0026#x3C;/\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-string-expression)\"\u003ediv\u003c/span\u003e\u003cspan style=\"color:var(--shiki-foreground)\"\u003e\u003e\u003c/span\u003e\u003c/span\u003e\n\u003cspan class=\"line\"\u003e\u003cspan style=\"color:var(--shiki-token-comment)\"\u003e// after: feature rows with real UI, or an editorial divided list\u003c/span\u003e\u003c/span\u003e\n\u003cspan class=\"line\"\u003e\u003cspan style=\"color:var(--shiki-foreground)\"\u003e\u0026#x3C;\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-string-expression)\"\u003eul\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-function)\"\u003e className\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-keyword)\"\u003e=\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-string-expression)\"\u003e\"divide-y divide-line-subtle border-y border-line-subtle\"\u003c/span\u003e\u003cspan style=\"color:var(--shiki-foreground)\"\u003e\u003e\u003c/span\u003e\u003c/span\u003e\n\u003cspan class=\"line\"\u003e\u003cspan style=\"color:var(--shiki-foreground)\"\u003e {\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-constant)\"\u003efeatures\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-function)\"\u003e.map\u003c/span\u003e\u003cspan style=\"color:var(--shiki-foreground)\"\u003e((f\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-punctuation)\"\u003e,\u003c/span\u003e\u003cspan style=\"color:var(--shiki-foreground)\"\u003e i) \u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-keyword)\"\u003e=\u003e\u003c/span\u003e\u003cspan style=\"color:var(--shiki-foreground)\"\u003e (\u003c/span\u003e\u003c/span\u003e\n\u003cspan class=\"line\"\u003e\u003cspan style=\"color:var(--shiki-foreground)\"\u003e \u0026#x3C;\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-string-expression)\"\u003eli\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-function)\"\u003e key\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-keyword)\"\u003e=\u003c/span\u003e\u003cspan style=\"color:var(--shiki-foreground)\"\u003e{\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-constant)\"\u003ef\u003c/span\u003e\u003cspan style=\"color:var(--shiki-foreground)\"\u003e.title} \u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-function)\"\u003eclassName\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-keyword)\"\u003e=\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-string-expression)\"\u003e\"grid gap-3 py-6 lg:grid-cols-12\"\u003c/span\u003e\u003cspan style=\"color:var(--shiki-foreground)\"\u003e\u003e\u003c/span\u003e\u003c/span\u003e\n\u003cspan class=\"line\"\u003e\u003cspan style=\"color:var(--shiki-foreground)\"\u003e \u0026#x3C;\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-string-expression)\"\u003espan\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-function)\"\u003e className\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-keyword)\"\u003e=\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-string-expression)\"\u003e\"label-mono text-fg-subtle lg:col-span-2\"\u003c/span\u003e\u003cspan style=\"color:var(--shiki-foreground)\"\u003e\u003e{\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-function)\"\u003eString\u003c/span\u003e\u003cspan style=\"color:var(--shiki-foreground)\"\u003e(i \u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-keyword)\"\u003e+\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-constant)\"\u003e 1\u003c/span\u003e\u003cspan style=\"color:var(--shiki-foreground)\"\u003e)\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-function)\"\u003e.padStart\u003c/span\u003e\u003cspan style=\"color:var(--shiki-foreground)\"\u003e(\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-constant)\"\u003e2\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-punctuation)\"\u003e,\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-string-expression)\"\u003e \"0\"\u003c/span\u003e\u003cspan style=\"color:var(--shiki-foreground)\"\u003e)}\u0026#x3C;/\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-string-expression)\"\u003espan\u003c/span\u003e\u003cspan style=\"color:var(--shiki-foreground)\"\u003e\u003e\u003c/span\u003e\u003c/span\u003e\n\u003cspan class=\"line\"\u003e\u003cspan style=\"color:var(--shiki-foreground)\"\u003e \u0026#x3C;\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-string-expression)\"\u003eh3\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-function)\"\u003e className\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-keyword)\"\u003e=\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-string-expression)\"\u003e\"text-xl text-fg lg:col-span-4\"\u003c/span\u003e\u003cspan style=\"color:var(--shiki-foreground)\"\u003e\u003e{\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-constant)\"\u003ef\u003c/span\u003e\u003cspan style=\"color:var(--shiki-foreground)\"\u003e.title}\u0026#x3C;/\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-string-expression)\"\u003eh3\u003c/span\u003e\u003cspan style=\"color:var(--shiki-foreground)\"\u003e\u003e\u003c/span\u003e\u003c/span\u003e\n\u003cspan class=\"line\"\u003e\u003cspan style=\"color:var(--shiki-foreground)\"\u003e \u0026#x3C;\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-string-expression)\"\u003ep\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-function)\"\u003e className\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-keyword)\"\u003e=\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-string-expression)\"\u003e\"text-md text-fg-muted lg:col-span-6\"\u003c/span\u003e\u003cspan style=\"color:var(--shiki-foreground)\"\u003e\u003e{\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-constant)\"\u003ef\u003c/span\u003e\u003cspan style=\"color:var(--shiki-foreground)\"\u003e.body}\u0026#x3C;/\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-string-expression)\"\u003ep\u003c/span\u003e\u003cspan style=\"color:var(--shiki-foreground)\"\u003e\u003e\u003c/span\u003e\u003c/span\u003e\n\u003cspan class=\"line\"\u003e\u003cspan style=\"color:var(--shiki-foreground)\"\u003e \u0026#x3C;/\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-string-expression)\"\u003eli\u003c/span\u003e\u003cspan style=\"color:var(--shiki-foreground)\"\u003e\u003e\u003c/span\u003e\u003c/span\u003e\n\u003cspan class=\"line\"\u003e\u003cspan style=\"color:var(--shiki-foreground)\"\u003e ))}\u003c/span\u003e\u003c/span\u003e\n\u003cspan class=\"line\"\u003e\u003cspan style=\"color:var(--shiki-foreground)\"\u003e\u0026#x3C;/\u003c/span\u003e\u003cspan style=\"color:var(--shiki-token-string-expression)\"\u003eul\u003c/span\u003e\u003cspan style=\"color:var(--shiki-foreground)\"\u003e\u003e\u003c/span\u003e\u003c/span\u003e\u003c/code\u003e\u003c/pre\u003e\u003c/figure\u003e\n\u003cp\u003e\u003cstrong\u003e19. Random bento.\u003c/strong\u003e Spans must follow importance; each tile shows something real (UI, data, code). If tiles would hold only icon + title + text, use tell 18\u0026#39;s list instead.\u003c/p\u003e\n\u003cp\u003e\u003cstrong\u003e20. Uniform section padding.\u003c/strong\u003e Measured 96–160px with variation. Replace every \u003ccode\u003epy-20\u003c/code\u003e with the rhythm table in \u003ca class=\"code-link\" href=\"/docs/craft/layout\"\u003e\u003ccode\u003elayout.md\u003c/code\u003e\u003c/a\u003e.\u003c/p\u003e\n\u003cp\u003e\u003cstrong\u003e21. Unreadable line length.\u003c/strong\u003e \u003ccode\u003emax-w-7xl\u003c/code\u003e paragraphs → \u003ccode\u003emax-w-prose\u003c/code\u003e or \u003ccode\u003emax-w-[60ch]\u003c/code\u003e (\u003ca class=\"code-link\" href=\"/rules/design/line-length-long\"\u003e\u003ccode\u003edesign/line-length-long\u003c/code\u003e\u003c/a\u003e).\u003c/p\u003e\n\u003cp\u003e\u003cstrong\u003e22. Generic navbar\u003c/strong\u003e (80px, 5 centered links, gradient button). Measured headers 56–72px, CTA solid neutral or brand, small.\u003c/p\u003e\n\u003cfigure class=\"code-block\" data-lang=\"tsx\"\u003e\u003cfigcaption\u003e\u003cspan\u003etsx\u003c/span\u003e\u003cbutton type=\"button\" class=\"copy-button\" data-copy\u003eCopy\u003c/button\u003e\u003c/figcaption\u003e\u003cpre tabindex=\"0\" aria-label=\"tsx code\" class=\"shiki void\" style=\"background-color:var(--shiki-background);color:var(--shiki-foreground)\" tabindex=\"0\"\u003e\u003ccode\u003e\u003cspan class=\"line\"\u003e\u003cspan style=\"color:var(--shiki-token-comment)\"\u003e// after: template SiteHeader — sticky h-(--header-h), text-sm links text-fg-muted, Button size=\"sm\"\u003c/span\u003e\u003c/span\u003e\u003c/code\u003e\u003c/pre\u003e\u003c/figure\u003e\n\u003ch2 id=\"components-and-details\"\u003e\u003ca class=\"heading-anchor\" href=\"#components-and-details\"\u003eComponents and details\u003c/a\u003e\u003c/h2\u003e\n\u003cp\u003e\u003cstrong\u003e23. \u003ccode\u003erounded-2xl shadow-xl\u003c/code\u003e everywhere.\u003c/strong\u003e \u003ccode\u003eshadow-xl\u003c/code\u003e doesn\u0026#39;t exist in void (emits nothing) and cards cap at \u003ccode\u003erounded-xl\u003c/code\u003e.\u003c/p\u003e\n\u003cfigure class=\"code-block\" data-lang=\"tsx\"\u003e\u003cfigcaption\u003e\u003cspan\u003etsx\u003c/span\u003e\u003cbutton type=\"button\" class=\"copy-button\" data-copy\u003eCopy\u003c/button\u003e\u003c/figcaption\u003e\u003cpre tabindex=\"0\" aria-label=\"tsx code\" class=\"shiki void\" style=\"background-color:var(--shiki-background);color:var(--shiki-foreground)\" tabindex=\"0\"\u003e\u003ccode\u003e\u003cspan class=\"line\"\u003e\u003cspan style=\"color:var(--shiki-token-comment)\"\u003e// before \u0026#x3C;div className=\"rounded-3xl shadow-2xl p-10\"\u003e\u003c/span\u003e\u003c/span\u003e\n\u003cspan class=\"line\"\u003e\u003cspan style=\"color:var(--shiki-token-comment)\"\u003e// after \u0026#x3C;Card className=\"p-6\"\u003e // surface-card: radius-xl + hairline + shadow-1\u003c/span\u003e\u003c/span\u003e\u003c/code\u003e\u003c/pre\u003e\u003c/figure\u003e\n\u003cp\u003e\u003cstrong\u003e24. Border + shadow + bg change on hover.\u003c/strong\u003e\u003c/p\u003e\n\u003cfigure class=\"code-block\" data-lang=\"tsx\"\u003e\u003cfigcaption\u003e\u003cspan\u003etsx\u003c/span\u003e\u003cbutton type=\"button\" class=\"copy-button\" data-copy\u003eCopy\u003c/button\u003e\u003c/figcaption\u003e\u003cpre tabindex=\"0\" aria-label=\"tsx code\" class=\"shiki void\" style=\"background-color:var(--shiki-background);color:var(--shiki-foreground)\" tabindex=\"0\"\u003e\u003ccode\u003e\u003cspan class=\"line\"\u003e\u003cspan style=\"color:var(--shiki-token-comment)\"\u003e// before \u0026#x3C;a className=\"border shadow hover:shadow-xl hover:bg-gray-50 hover:border-indigo-500 hover:-translate-y-2\"\u003e\u003c/span\u003e\u003c/span\u003e\n\u003cspan class=\"line\"\u003e\u003cspan style=\"color:var(--shiki-token-comment)\"\u003e// after \u0026#x3C;a className=\"press rounded-xl border border-line-subtle p-6 transition-colors duration-(--duration-fast) hover:border-line-strong\"\u003e\u003c/span\u003e\u003c/span\u003e\u003c/code\u003e\u003c/pre\u003e\u003c/figure\u003e\n\u003cp\u003e\u003cstrong\u003e25. Non-concentric corners.\u003c/strong\u003e \u003ccode\u003erounded-2xl\u003c/code\u003e parent with \u003ccode\u003ep-2\u003c/code\u003e and \u003ccode\u003erounded-2xl\u003c/code\u003e child → \u003ccode\u003eradius-nested\u003c/code\u003e on the parent.\u003c/p\u003e\n\u003cp\u003e\u003cstrong\u003e26. Emoji or circled icons.\u003c/strong\u003e (\u003ca class=\"code-link\" href=\"/rules/design/emoji-icons\"\u003e\u003ccode\u003edesign/emoji-icons\u003c/code\u003e\u003c/a\u003e)\u003c/p\u003e\n\u003cfigure class=\"code-block\" data-lang=\"tsx\"\u003e\u003cfigcaption\u003e\u003cspan\u003etsx\u003c/span\u003e\u003cbutton type=\"button\" class=\"copy-button\" data-copy\u003eCopy\u003c/button\u003e\u003c/figcaption\u003e\u003cpre tabindex=\"0\" aria-label=\"tsx code\" class=\"shiki void\" style=\"background-color:var(--shiki-background);color:var(--shiki-foreground)\" tabindex=\"0\"\u003e\u003ccode\u003e\u003cspan class=\"line\"\u003e\u003cspan style=\"color:var(--shiki-token-comment)\"\u003e// before \u0026#x3C;h3\u003e🚀 Fast deploys\u0026#x3C;/h3\u003e \u0026#x3C;div className=\"grid size-12 place-items-center rounded-full bg-blue-100\"\u003e\u0026#x3C;Rocket/\u003e\u0026#x3C;/div\u003e\u003c/span\u003e\u003c/span\u003e\n\u003cspan class=\"line\"\u003e\u003cspan style=\"color:var(--shiki-token-comment)\"\u003e// after \u0026#x3C;h3 className=\"flex items-center gap-2 text-xl\"\u003e\u0026#x3C;Rocket aria-hidden className=\"size-4 text-fg-muted\" strokeWidth={1.5}/\u003eFast deploys\u0026#x3C;/h3\u003e\u003c/span\u003e\u003c/span\u003e\u003c/code\u003e\u003c/pre\u003e\u003c/figure\u003e\n\u003cp\u003e\u003cstrong\u003e27. Hover scale-up and glowing buttons.\u003c/strong\u003e Measured press is scale \u003cstrong\u003edown\u003c/strong\u003e 0.96–0.98; hover is a color step in 100–200ms.\u003c/p\u003e\n\u003cfigure class=\"code-block\" data-lang=\"tsx\"\u003e\u003cfigcaption\u003e\u003cspan\u003etsx\u003c/span\u003e\u003cbutton type=\"button\" class=\"copy-button\" data-copy\u003eCopy\u003c/button\u003e\u003c/figcaption\u003e\u003cpre tabindex=\"0\" aria-label=\"tsx code\" class=\"shiki void\" style=\"background-color:var(--shiki-background);color:var(--shiki-foreground)\" tabindex=\"0\"\u003e\u003ccode\u003e\u003cspan class=\"line\"\u003e\u003cspan style=\"color:var(--shiki-token-comment)\"\u003e// before \u0026#x3C;button className=\"transition-all duration-300 hover:scale-105 shadow-lg shadow-indigo-500/50\"\u003e\u003c/span\u003e\u003c/span\u003e\n\u003cspan class=\"line\"\u003e\u003cspan style=\"color:var(--shiki-token-comment)\"\u003e// after \u0026#x3C;Button\u003eDeploy\u0026#x3C;/Button\u003e // press utility + bg-brand → hover:bg-brand-hover\u003c/span\u003e\u003c/span\u003e\u003c/code\u003e\u003c/pre\u003e\u003c/figure\u003e\n\u003cp\u003e\u003cstrong\u003e28. Fake proof.\u003c/strong\u003e Invented logos, \u0026quot;10K+ users\u0026quot;, 5-star carousels with stock avatars. Fix: real proof or omit. Placeholder protocol in \u003ca class=\"code-link\" href=\"/docs/website\"\u003e\u003ccode\u003ewebsite\u003c/code\u003e\u003c/a\u003e §3. A single long, specific, attributed quote beats a carousel.\u003c/p\u003e\n\u003ch2 id=\"motion-and-copy\"\u003e\u003ca class=\"heading-anchor\" href=\"#motion-and-copy\"\u003eMotion and copy\u003c/a\u003e\u003c/h2\u003e\n\u003cp\u003e\u003cstrong\u003e29. Fade-up on every section; \u003ccode\u003etransition-all duration-300\u003c/code\u003e.\u003c/strong\u003e (\u003ca class=\"code-link\" href=\"/rules/lint/transition-all\"\u003e\u003ccode\u003elint/transition-all\u003c/code\u003e\u003c/a\u003e, \u003ca class=\"code-link\" href=\"/rules/smooth/transition-all\"\u003e\u003ccode\u003esmooth/transition-all\u003c/code\u003e\u003c/a\u003e)\u003c/p\u003e\n\u003cfigure class=\"code-block\" data-lang=\"tsx\"\u003e\u003cfigcaption\u003e\u003cspan\u003etsx\u003c/span\u003e\u003cbutton type=\"button\" class=\"copy-button\" data-copy\u003eCopy\u003c/button\u003e\u003c/figcaption\u003e\u003cpre tabindex=\"0\" aria-label=\"tsx code\" class=\"shiki void\" style=\"background-color:var(--shiki-background);color:var(--shiki-foreground)\" tabindex=\"0\"\u003e\u003ccode\u003e\u003cspan class=\"line\"\u003e\u003cspan style=\"color:var(--shiki-token-comment)\"\u003e// before \u0026#x3C;motion.section initial={{opacity:0,y:50}} whileInView={{opacity:1,y:0}} transition={{duration:1}}\u003e\u003c/span\u003e\u003c/span\u003e\n\u003cspan class=\"line\"\u003e\u003cspan style=\"color:var(--shiki-token-comment)\"\u003e// after \u0026#x3C;section className=\"section-y\"\u003e … \u0026#x3C;figure className=\"reveal\"\u003e…\u0026#x3C;/figure\u003e // 1–3 reveals per page, CSS only\u003c/span\u003e\u003c/span\u003e\u003c/code\u003e\u003c/pre\u003e\u003c/figure\u003e\n\u003cp\u003e\u003cstrong\u003e30. Buzzword copy.\u003c/strong\u003e\u003c/p\u003e\n\u003cfigure class=\"code-block\" data-lang=\"text\"\u003e\u003cfigcaption\u003e\u003cspan\u003etext\u003c/span\u003e\u003cbutton type=\"button\" class=\"copy-button\" data-copy\u003eCopy\u003c/button\u003e\u003c/figcaption\u003e\u003cpre tabindex=\"0\" aria-label=\"text code\" class=\"shiki void\" style=\"background-color:var(--shiki-background);color:var(--shiki-foreground)\" tabindex=\"0\"\u003e\u003ccode\u003e\u003cspan class=\"line\"\u003e\u003cspan\u003ebefore Unlock the power of AI to supercharge your workflow seamlessly.\u003c/span\u003e\u003c/span\u003e\n\u003cspan class=\"line\"\u003e\u003cspan\u003eafter Turns a 40-minute incident review into a 3-paragraph summary with links to every log line.\u003c/span\u003e\u003c/span\u003e\u003c/code\u003e\u003c/pre\u003e\u003c/figure\u003e\n\u003cp\u003eBanned list and headline formulas: \u003ca class=\"code-link\" href=\"/docs/website/copy-and-content\"\u003e\u003ccode\u003ewebsite/references/copy-and-content.md\u003c/code\u003e\u003c/a\u003e.\u003c/p\u003e\n\u003ch2 id=\"omissions-that-also-betray-generation\"\u003e\u003ca class=\"heading-anchor\" href=\"#omissions-that-also-betray-generation\"\u003eOmissions that also betray generation\u003c/a\u003e\u003c/h2\u003e\n\u003cp\u003eNo \u003ccode\u003e:focus-visible\u003c/code\u003e style · no dark \u003ccode\u003ecolor-scheme\u003c/code\u003e / flash of wrong theme · lorem ipsum or \u0026quot;John Doe\u0026quot; · no empty/error/loading states · arbitrary values (\u003ccode\u003ep-[18px]\u003c/code\u003e, \u003ccode\u003etext-[#a1a1aa]\u003c/code\u003e, \u003ca class=\"code-link\" href=\"/rules/lint/tw-arbitrary-sprawl\"\u003e\u003ccode\u003elint/tw-arbitrary-sprawl\u003c/code\u003e\u003c/a\u003e) · mixed icon sets · missing favicon · \u003ccode\u003e\u003ctitle\u003e\u003c/code\u003e \u0026quot;Create Next App\u0026quot; · 12px tap targets · horizontal scroll at 390px.\u003c/p\u003e\n36:[\"$\",\"article\",null,{\"className\":\"min-w-0 max-w-[68ch] pt-8 lg:pt-4\",\"children\":[\"$undefined\",[\"$\",\"div\",null,{\"className\":\"prose\",\"dangerouslySetInnerHTML\":{\"__html\":\"$38\"}}],\"$L39\"]}]\n37:[\"$\",\"aside\",null,{\"aria-label\":\"Page contents\",\"className\":\"hidden xl:block\",\"children\":[\"$\",\"div\",null,{\"data-lenis-prevent\":true,\"className\":\"sticky top-(--header-h) max-h-[calc(100dvh-var(--header-h))] overflow-y-auto pt-4 pb-10 [scrollbar-width:thin]\",\"children\":[\"$\",\"nav\",null,{\"aria-label\":\"On this page\",\"className\":\"text-sm\",\"children\":[[\"$\",\"p\",null,{\"className\":\"label-mono mb-3 text-fg-muted\",\"children\":\"On this page\"}],[\"$\",\"ul\",null,{\"className\":\"grid gap-1.5 border-l border-line-subtle\",\"children\":[[\"$\",\"li\",\"color\",{\"children\":[\"$\",\"a\",null,{\"href\":\"#color\",\"className\":\"block py-0.5 pr-2 text-fg-muted transition-colors duration-(--duration-fast) hover:text-fg pl-4\",\"children\":\"Color\"}]}],[\"$\",\"li\",\"typography\",{\"children\":[\"$\",\"a\",null,{\"href\":\"#typography\",\"className\":\"block py-0.5 pr-2 text-fg-muted transition-colors duration-(--duration-fast) hover:text-fg pl-4\",\"children\":\"Typography\"}]}],[\"$\",\"li\",\"layout\",{\"children\":[\"$\",\"a\",null,{\"href\":\"#layout\",\"className\":\"block py-0.5 pr-2 text-fg-muted transition-colors duration-(--duration-fast) hover:text-fg pl-4\",\"children\":\"Layout\"}]}],[\"$\",\"li\",\"components-and-details\",{\"children\":[\"$\",\"a\",null,{\"href\":\"#components-and-details\",\"className\":\"block py-0.5 pr-2 text-fg-muted transition-colors duration-(--duration-fast) hover:text-fg pl-4\",\"children\":\"Components and details\"}]}],[\"$\",\"li\",\"motion-and-copy\",{\"children\":[\"$\",\"a\",null,{\"href\":\"#motion-and-copy\",\"className\":\"block py-0.5 pr-2 text-fg-muted transition-colors duration-(--duration-fast) hover:text-fg pl-4\",\"children\":\"Motion and copy\"}]}],[\"$\",\"li\",\"omissions-that-also-betray-generation\",{\"children\":[\"$\",\"a\",null,{\"href\":\"#omissions-that-also-betray-generation\",\"className\":\"block py-0.5 pr-2 text-fg-muted transition-colors duration-(--duration-fast) hover:text-fg pl-4\",\"children\":\"Omissions that also betray generation\"}]}]]}]]}]}]}]\n39:[\"$\",\"footer\",null,{\"className\":\"mt-16 border-t border-line-subtle pt-8 pb-20\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex flex-wrap items-center justify-between gap-3 font-mono text-xs text-fg-muted\",\"children\":[[\"$\",\"span\",null,{\"children\":[\"Updated \",[\"$\",\"time\",null,{\"dateTime\":\"2026-09-16\",\"children\":\"16 Sept 2026\"}]]}],[\"$\",\"span\",null,{\"className\":\"flex gap-4\",\"children\":[[\"$\",\"a\",null,{\"href\":\"/docs/craft/anti-slop.md\",\"className\":\"hover:text-fg\",\"children\":\"View as Markdown\"}],[\"$\",\"a\",null,{\"href\":\"https://github.com/ParthKapoor-dev/design/blob/main/skills/craft/references/anti-slop.md\",\"rel\":\"noopener noreferrer\",\"className\":\"hover:text-fg\",\"children\":\"Edit on GitHub\"}]]}]]}],[\"$\",\"div\",null,{\"className\":\"mt-8 grid gap-3 sm:grid-cols-2\",\"children\":[[\"$\",\"$La\",null,{\"href\":\"/docs/craft\",\"className\":\"press group flex flex-col gap-1 rounded-lg border border-line-subtle p-4 transition-colors duration-(--duration-fast) hover:border-line-strong\",\"children\":[[\"$\",\"span\",null,{\"className\":\"label-mono flex items-center gap-1.5 text-fg-muted\",\"children\":[[\"$\",\"svg\",null,{\"aria-hidden\":true,\"viewBox\":\"0 0 16 16\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":1.5,\"className\":\"size-3\",\"children\":[\"$\",\"path\",null,{\"d\":\"M13 8H3.5M7.5 4l-4 4 4 4\",\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\"}]}],\" Previous\"]}],[\"$\",\"span\",null,{\"className\":\"text-sm text-fg\",\"children\":\"craft skill\"}]]}],[\"$\",\"$La\",null,{\"href\":\"/docs/craft/color\",\"className\":\"press group flex flex-col items-end gap-1 rounded-lg border border-line-subtle p-4 text-right transition-colors duration-(--duration-fast) hover:border-line-strong\",\"children\":[[\"$\",\"span\",null,{\"className\":\"label-mono flex items-center gap-1.5 text-fg-muted\",\"children\":[\"Next \",[\"$\",\"svg\",null,{\"aria-hidden\":true,\"viewBox\":\"0 0 16 16\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":1.5,\"className\":\"size-3\",\"children\":[\"$\",\"path\",null,{\"d\":\"M3 8h9.5M8.5 4l4 4-4 4\",\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\"}]}]]}],[\"$\",\"span\",null,{\"className\":\"text-sm text-fg\",\"children\":\"craft: color\"}]]}]]}]]}]\n2c:[[\"$\",\"meta\",\"0\",{\"charSet\":\"utf-8\"}],[\"$\",\"meta\",\"1\",{\"name\":\"viewport\",\"content\":\"width=device-width, initial-scale=1\"}],[\"$\",\"meta\",\"2\",{\"name\":\"theme-color\",\"content\":\"#020203\"}],[\"$\",\"meta\",\"3\",{\"name\":\"color-scheme\",\"content\":\"dark\"}]]\n3a:I[49310,[\"/_next/static/immutable/chunks/455sb5e0fgpzb.js\"],\"IconMark\"]\n2a:null\n2e:[[\"$\",\"title\",\"0\",{\"children\":\"Anti-slop: 30 tells with before/after (craft) | void\"}],[\"$\",\"meta\",\"1\",{\"name\":\"description\",\"content\":\"Each tell reads as \\\"generated\\\" because the measured top sites don't do it. Numbers are from the 24-site teardown (2026-09-15).\"}],[\"$\",\"meta\",\"2\",{\"name\":\"application-name\",\"content\":\"void\"}],[\"$\",\"link\",\"3\",{\"rel\":\"author\",\"href\":\"https://parthkapoor.me\"}],[\"$\",\"meta\",\"4\",{\"name\":\"author\",\"content\":\"Parth Kapoor\"}],[\"$\",\"link\",\"5\",{\"rel\":\"manifest\",\"href\":\"/manifest.webmanifest\",\"crossOrigin\":\"$undefined\"}],[\"$\",\"meta\",\"6\",{\"name\":\"keywords\",\"content\":\"design system,AI coding agents,Claude Code,WebGL,shaders,web performance,accessibility,SEO,Next.js,Tailwind\"}],[\"$\",\"meta\",\"7\",{\"name\":\"creator\",\"content\":\"Parth Kapoor\"}],[\"$\",\"meta\",\"8\",{\"name\":\"publisher\",\"content\":\"Parth Kapoor\"}],[\"$\",\"meta\",\"9\",{\"name\":\"robots\",\"content\":\"index, follow\"}],[\"$\",\"meta\",\"10\",{\"name\":\"googlebot\",\"content\":\"index, follow, max-video-preview:-1, max-image-preview:large, max-snippet:-1\"}],[\"$\",\"meta\",\"11\",{\"name\":\"category\",\"content\":\"technology\"}],[\"$\",\"link\",\"12\",{\"rel\":\"canonical\",\"href\":\"https://void-design.vercel.app/docs/craft/anti-slop\"}],[\"$\",\"link\",\"13\",{\"rel\":\"alternate\",\"type\":\"text/markdown\",\"href\":\"https://void-design.vercel.app/docs/craft/anti-slop.md\"}],[\"$\",\"meta\",\"14\",{\"name\":\"format-detection\",\"content\":\"telephone=no, address=no, email=no\"}],[\"$\",\"meta\",\"15\",{\"name\":\"mobile-web-app-capable\",\"content\":\"yes\"}],[\"$\",\"meta\",\"16\",{\"name\":\"apple-mobile-web-app-title\",\"content\":\"void\"}],[\"$\",\"meta\",\"17\",{\"name\":\"apple-mobile-web-app-status-bar-style\",\"content\":\"black-translucent\"}],[\"$\",\"meta\",\"18\",{\"property\":\"og:title\",\"content\":\"Anti-slop: 30 tells with before/after (craft)\"}],[\"$\",\"meta\",\"19\",{\"property\":\"og:description\",\"content\":\"Each tell reads as \\\"generated\\\" because the measured top sites don't do it. Numbers are from the 24-site teardown (2026-09-15).\"}],[\"$\",\"meta\",\"20\",{\"property\":\"og:url\",\"content\":\"https://void-design.vercel.app/docs/craft/anti-slop\"}],[\"$\",\"meta\",\"21\",{\"property\":\"og:site_name\",\"content\":\"void\"}],[\"$\",\"meta\",\"22\",{\"property\":\"og:locale\",\"content\":\"en_US\"}],[\"$\",\"meta\",\"23\",{\"property\":\"og:image\",\"content\":\"https://void-design.vercel.app/docs/craft/anti-slop/opengraph-image-1ld1wd?aa6cbcff18b3a4be\"}],[\"$\",\"meta\",\"24\",{\"property\":\"og:image:type\",\"content\":\"image/png\"}],[\"$\",\"meta\",\"25\",{\"property\":\"og:image:width\",\"content\":\"1200\"}],[\"$\",\"meta\",\"26\",{\"property\":\"og:image:height\",\"content\":\"630\"}],[\"$\",\"meta\",\"27\",{\"property\":\"og:image:alt\",\"content\":\"void skill reference\"}],[\"$\",\"meta\",\"28\",{\"property\":\"og:type\",\"content\":\"article\"}],[\"$\",\"meta\",\"29\",{\"property\":\"article:modified_time\",\"content\":\"2026-09-16\"}],[\"$\",\"meta\",\"30\",{\"name\":\"twitter:card\",\"content\":\"summary_large_image\"}],[\"$\",\"meta\",\"31\",{\"name\":\"twitter:title\",\"content\":\"Anti-slop: 30 tells with before/after (craft)\"}],[\"$\",\"meta\",\"32\",{\"name\":\"twitter:description\",\"content\":\"Each tell reads as \\\"generated\\\" because the measured top sites don't do it. Numbers are from the 24-site teardown (2026-09-15).\"}],[\"$\",\"meta\",\"33\",{\"name\":\"twitter:image\",\"content\":\"https://void-design.vercel.app/docs/craft/anti-slop/opengraph-image-1ld1wd?aa6cbcff18b3a4be\"}],[\"$\",\"meta\",\"34\",{\"name\":\"twitter:image:alt\",\"content\":\"void skill reference\"}],[\"$\",\"meta\",\"35\",{\"name\":\"twitter:image:type\",\"content\":\"image/png\"}],[\"$\",\"meta\",\"36\",{\"name\":\"twitter:image:width\",\"content\":\"1200\"}],[\"$\",\"meta\",\"37\",{\"name\":\"twitter:image:height\",\"content\":\"630\"}],[\"$\",\"link\",\"38\",{\"rel\":\"icon\",\"href\":\"/favicon.ico?favicon.07_7ic0_1d0u-.ico\",\"sizes\":\"48x48\",\"type\":\"image/x-icon\"}],[\"$\",\"link\",\"39\",{\"rel\":\"icon\",\"href\":\"/icon.svg?icon.0uaj260ufluee.svg\",\"sizes\":\"any\",\"type\":\"image/svg+xml\"}],[\"$\",\"link\",\"40\",{\"rel\":\"apple-touch-icon\",\"href\":\"/apple-icon.png?apple-icon.0wjwpgjlk50hj.png\",\"sizes\":\"180x180\",\"type\":\"image/png\"}],[\"$\",\"$L3a\",\"41\",{}]]\n"])</script></body></html>