mirror of
https://github.com/pbakaus/impeccable.git
synced 2026-09-15 15:46:30 +03:00
Paul Bakaus
b6a34de55a
Unit tests of the deleted Node scripts and the JS detector are removed; their behavior is pinned by tests/oracle goldens (frozen JS behavior plus reviewed deltas) and the engine's own tests. tests/oracle.test.mjs replays the corpus against the binary (IMPECCABLE_BIN or skill/scripts/bin/<target>/, via tests/lib/engine-bin.mjs) and skips cleanly without one; the framework fixture sweep drives live-inject, live-wrap, and detect-csp through the binary the same way. record.mjs learns --bin. The function-level vectors under tests/oracle/vectors/calls are committed as the frozen snapshot they can no longer be regenerated from. Suites: core trimmed to build and transformer tests, oracle added to the default run, detector/live reduced to packaging and reference checks, the live-e2e helper tests move to the opt-in live-e2e lane pending its retarget, cli-remote-e2e is an empty placeholder. Prepared with AI assistance (Claude Code).
365 lines
114 KiB
JSON
365 lines
114 KiB
JSON
{"args":[{"headingLevel":3,"headingText":"Pure black surfaces","headingFontSize":11,"kickerTag":"h2","kickerText":"Should flag","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":14,"kickerLetterSpacing":0.7000000000000001}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Gray on color","headingFontSize":11,"kickerTag":"div","kickerText":"Pure #000 background","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Low contrast","headingFontSize":11,"kickerTag":"div","kickerText":"Gray text on green background","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Gradient text","headingFontSize":11,"kickerTag":"div","kickerText":"Welcome to Our Platform The best solution for modern teams and businesses","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Gradient Heading","headingFontSize":24,"kickerTag":"h3","kickerText":"Gradient text","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":11,"kickerLetterSpacing":0.55}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"AI color palette","headingFontSize":11,"kickerTag":"h3","kickerText":"Gradient Heading","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":24,"kickerLetterSpacing":1.2000000000000002}],"result":false}
|
|
{"args":[{"headingLevel":1,"headingText":"Purple heading text","headingFontSize":24,"kickerTag":"h3","kickerText":"AI color palette","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":11,"kickerLetterSpacing":0.55}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Styled <a> and <button> with low contrast","headingFontSize":11,"kickerTag":"h1","kickerText":"Purple heading text","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":24,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Text-bearing chip with low contrast","headingFontSize":11,"kickerTag":"button","kickerText":"Submit","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":14,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Tailwind color anti-patterns","headingFontSize":11,"kickerTag":"span","kickerText":"SEV-2","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":11,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"text-purple-500 heading","headingFontSize":24,"kickerTag":"div","kickerText":"text-gray-400 on bg-blue-500 — gray on color","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"currentcolor surface via var() token","headingFontSize":11,"kickerTag":"div","kickerText":"Purple-to-indigo gradient","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Tinted neutrals","headingFontSize":11,"kickerTag":"h2","kickerText":"Should pass","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":14,"kickerLetterSpacing":0.7000000000000001}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Pure white surface is acceptable","headingFontSize":11,"kickerTag":"div","kickerText":"Near-white bg, near-black text — good contrast, tinted","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Good contrast","headingFontSize":11,"kickerTag":"div","kickerText":"Pure #fff background with dark text — acceptable contrast","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Distinctive accents (not AI purple)","headingFontSize":11,"kickerTag":"div","kickerText":"Dark green text on green bg — same hue family","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Red heading — not AI purple","headingFontSize":20,"kickerTag":"h3","kickerText":"Distinctive accents (not AI purple)","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":11,"kickerLetterSpacing":0.55}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Amber heading — distinctive","headingFontSize":20,"kickerTag":"h3","kickerText":"Red heading — not AI purple","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":20,"kickerLetterSpacing":1}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Background-image url() ancestor (not low contrast)","headingFontSize":11,"kickerTag":"h3","kickerText":"Amber heading — distinctive","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":20,"kickerLetterSpacing":1}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Tailwind opacity-modified bg-black (not pure black)","headingFontSize":11,"kickerTag":"div","kickerText":"White text on image background — should not flag low-contrast","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Inline <a> without own background (must remain skipped)","headingFontSize":11,"kickerTag":"div","kickerText":"bg-black/50 — 50% opacity, not pure black","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Styled <a> with good contrast (must not flag)","headingFontSize":11,"kickerTag":"p","kickerText":"Read more about this if you want to learn more about the topic.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Chip with good contrast (must not flag)","headingFontSize":11,"kickerTag":"a","kickerText":"High contrast pill","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":14,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Sub-9px decorative chip (below the font floor, must not flag)","headingFontSize":11,"kickerTag":"span","kickerText":"HEALTHY","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":11,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"background: none resets an earlier background-color","headingFontSize":11,"kickerTag":"span","kickerText":"tick","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":8,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Gradient-clipped text (issue #409 Case A — must not flag contrast)","headingFontSize":11,"kickerTag":"div","kickerText":"light text over the dark panel, not the light code surface","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":1,"headingText":"Gradient Clipped Heading Text","headingFontSize":40,"kickerTag":"h3","kickerText":"Gradient-clipped text (issue #409 Case A — must not flag contrast)","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":11,"kickerLetterSpacing":0.55}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Faint accent-glow gradient (issue #409 Case B — must not flag contrast)","headingFontSize":11,"kickerTag":"h1","kickerText":"Gradient Clipped Heading Text","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":40,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"color-mix gradient stop: nested ingredient is not a surface","headingFontSize":11,"kickerTag":"div","kickerText":"Light body copy on a faint accent glow that composites to near-black Muted secondary line on the same faint glow area here","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"currentcolor surface with good contrast","headingFontSize":11,"kickerTag":"div","kickerText":"Light copy on a faint mixed wash over a dark ground stays readable","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"currentcolor surface with unresolvable token (must abstain)","headingFontSize":11,"kickerTag":"div","kickerText":"Dark ink text on a bone currentcolor surface","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Emoji on light backgrounds","headingFontSize":11,"kickerTag":"div","kickerText":"Light text on an unknowable currentcolor surface","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Cramped body in cards","headingFontSize":12,"kickerTag":"h2","kickerText":"Should flag","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":14,"kickerLetterSpacing":0.7000000000000001}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Asymmetric cramping","headingFontSize":12,"kickerTag":"div","kickerText":"16px body, 4px padding, background only A colored background containment with only 4px padding around 16px body text. The colored edge feels like it's pressing in.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Currently missed: cramped large text","headingFontSize":12,"kickerTag":"div","kickerText":"12px vertical / 4px horizontal, 14px body Comfortable vertical padding can't fix horizontal text running right up against the side edges. Words feel like they're falling off the container.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Cramped multi-line code block","headingFontSize":12,"kickerTag":"div","kickerText":"32px hero, 6px vertical / 16px horizontal padding Hero Section With Tight Vertical Padding","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Small inline pills","headingFontSize":12,"kickerTag":"h2","kickerText":"Should pass","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":14,"kickerLetterSpacing":0.7000000000000001}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Cards at current standards","headingFontSize":12,"kickerTag":"div","kickerText":"long inline code chip: compact inline code should not be treated like a padded card npx impeccable check","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Comfortable code blocks","headingFontSize":12,"kickerTag":"div","kickerText":"18px body, 12px padding (proportional) Larger body text gets proportionally more padding. 12px around 18px text feels balanced.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Interactive elements","headingFontSize":12,"kickerTag":"div","kickerText":"multi-line <pre>, 12px padding, 14px font function example() { const value = \"comfortable\"; return value; }","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Big text with proportional padding","headingFontSize":12,"kickerTag":"div","kickerText":"form input: 16px font, 8px / 12px padding","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"Inline gradient heading","headingFontSize":28,"kickerTag":"h1","kickerText":"Ship Faster With Us","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":44,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"Tailwind gradient heading","headingFontSize":16,"kickerTag":"h2","kickerText":"Inline gradient heading","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":28,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"Detector","headingFontSize":20,"kickerTag":"h1","kickerText":"Changelog","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":34,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"What the rule catches","headingFontSize":20,"kickerTag":"p","kickerText":"gradients stop tripping the contrast rules when the glyph fill is transparent.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"Pulsing dots","headingFontSize":20,"kickerTag":"p","kickerText":"The Tailwind form pairs bg-clip-text with bg-gradient-to-r on one element; the two utilities together are the tell.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"Side stripes","headingFontSize":20,"kickerTag":"pre","kickerText":".status-dot { width: 8px; height: 8px; border-radius: 50%; animation: pulse 2s ease-in-out infinite; }","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":13,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":1,"headingText":"Should pass","headingFontSize":15,"kickerTag":"section","kickerText":"Flag Pale On Currentcolor Panel: the ground is the panel's own bone text color, so the keyword must resolve rather than abstain.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":15,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"Pass: symmetric insets","headingFontSize":16,"kickerTag":"div","kickerText":"Card cut off at the right clip edge while keeping its left gutter. Second card in the oversized panel, also flush against the edge. Sibling panel card with the intended inset on both sides.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"Pass: deliberate peek","headingFontSize":16,"kickerTag":"div","kickerText":"Card with an even gutter on both sides of the clip box. Second panel card, also properly inset.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"Pass: plain content, not cards","headingFontSize":16,"kickerTag":"div","kickerText":"First peek card fully visible. Second peek card fully visible. Third card cut mid-card as a scroll affordance. Fourth card entirely off-screen.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"Tracking crushed heading variant text","headingFontSize":16,"kickerTag":"p","kickerText":"Tracking crushed pixels heading line","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":64,"kickerLetterSpacing":-4}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Border + zero side-padding","headingFontSize":13,"kickerTag":"h2","kickerText":"Should flag","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":22,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"All sides flush against a border","headingFontSize":13,"kickerTag":"div","kickerText":"section: full border, padding 28px 0 0; label and pills touch the left/right border lines. Supported dev servers Vite Next.js SvelteKit Astro","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Background color, zero padding","headingFontSize":13,"kickerTag":"div","kickerText":"card: 1px border on all sides, padding 0; heading and body touch every side. Card flush against the borders Body copy sits flush against every visible border line.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Outline (not border), zero padding","headingFontSize":13,"kickerTag":"div","kickerText":"no border, but a non-transparent bg; text flush against the bg's edge counts too. Title flush against the bg edge Body copy with zero padding around a colored fill.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Left-side flush, other sides fine","headingFontSize":13,"kickerTag":"div","kickerText":"outline draws outside the box; content at the box edge sits next to the outline. Title flush against the outline The outline counts as a visible boundary too.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"No boundary at all","headingFontSize":13,"kickerTag":"h2","kickerText":"Should pass","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":22,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Top-only border, no side borders","headingFontSize":13,"kickerTag":"div","kickerText":"no bg, no border, no outline; zero padding is fine. Supported dev servers Vite Next.js SvelteKit","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Bordered card with proper inset","headingFontSize":13,"kickerTag":"div","kickerText":"border-top only, padding-top 24px; no left/right border to be flush against. Supported dev servers Vite Next.js SvelteKit","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Background card with proper inset","headingFontSize":13,"kickerTag":"div","kickerText":"card: 1px border + padding 18px 20px; comfortable inset on every side. Card with proper inset Body copy sits comfortably away from the borders.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Outline with proper inset","headingFontSize":13,"kickerTag":"div","kickerText":"non-transparent bg + padding 14px 18px; content has room to breathe. Title with inset on bg Body copy is comfortably inset from the bg edge.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Image-only container, no text","headingFontSize":13,"kickerTag":"div","kickerText":"outline + padding 14px 18px; content is comfortably inside. Title with inset and outline Outline boundary with proper inset works.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Child margins provide the inset","headingFontSize":13,"kickerTag":"div","kickerText":"card: padding 0, border all sides; no text means nothing can be flush.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Inner shell provides the inset","headingFontSize":13,"kickerTag":"div","kickerText":"card: parent padding 0, but text children have margins that create visible inset. Title inset by child margin Body copy is not visually flush even though the parent has zero padding.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Same background as parent","headingFontSize":13,"kickerTag":"div","kickerText":"card: parent padding 0, but an inner shell is offset from every edge. Title inset by inner shell The direct child creates the breathing room.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Full-bleed marquee shell","headingFontSize":13,"kickerTag":"div","kickerText":"child padding 0, but it has the same background as the parent, so no child boundary is visible. Same-surface visual shell The text belongs to the parent surface, not to a distinct zero-padding card.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Inner text surface","headingFontSize":13,"kickerTag":"div","kickerText":"marquee shell clips animated cards intentionally; the cards, not the shell, own text padding. Quote card with its own comfortable padding. Another moving card, also padded inside.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"CSS colored glows on dark background","headingFontSize":11,"kickerTag":"h2","kickerText":"Should flag","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":14,"kickerLetterSpacing":0.7000000000000001}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Inline-style glow (regex path)","headingFontSize":11,"kickerTag":"div","kickerText":"Blue glow box-shadow: 0 0 20px rgba(59, 130, 246, 0.4) Purple glow box-shadow: 0 0 25px rgba(139, 92, 246, 0.35) Cyan glow box-shadow: 0 0 15px rgba(6, 182, 212, 0.5) Multi-shadow with colored glow Normal shadow + purple glow combined.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Modern color formats, var() refs, text-shadow","headingFontSize":11,"kickerTag":"div","kickerText":"Inline pink glow Inline style for regex detection path.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Zero-offset halo on LIGHT background","headingFontSize":11,"kickerTag":"div","kickerText":"OKLCH glow box-shadow: 0 0 18px oklch(0.72 0.15 195 / 0.5) Hex glow box-shadow: 0 0 16px #3b82f6 HSL glow box-shadow: 0 0 22px hsl(280, 80%, 60%) Glow via var() box-shadow: 0 0 10px var(--fixture-glow) Glowing text text-shadow: 0 0 12px #22d3ee on the heading.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Zero-offset halo on unreadable (image) surface","headingFontSize":11,"kickerTag":"div","kickerText":"Chromatic halo on light page box-shadow: 0 0 20px oklch(0.65 0.2 300 / 0.45)","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Colored glow under an opaque gradient over an image (browser)","headingFontSize":11,"kickerTag":"div","kickerText":"Halo over photo background box-shadow: 0 0 26px rgba(217, 70, 239, 0.5)","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Light page + colored shadow","headingFontSize":11,"kickerTag":"h2","kickerText":"Should pass","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":14,"kickerLetterSpacing":0.7000000000000001}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Dark cards with neutral shadows","headingFontSize":11,"kickerTag":"div","kickerText":"Colored shadow on light background Not dark mode, colored shadow is fine.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Medium-gray background (not dark enough)","headingFontSize":11,"kickerTag":"div","kickerText":"Normal gray shadow on dark card Gray/black shadow is not a glow. Focus ring (spread, no blur) Functional ring, not decorative glow. Tiny blur (<5px) Too subtle to be \"glowing\". Small dark elevation Subtle shadow on dark card. Medium dark elevation Standard dark card shadow. Large dark elevation Prominent shadow on dark card. Inset shadow Inner shadow, not a glow. Multi-shadow dark card Layered gray shadows, no color glow.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Colored drop shadow / neutral halo on light background","headingFontSize":11,"kickerTag":"div","kickerText":"Not dark enough background Medium gray doesn't qualify as \"dark mode\".","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Offset chromatic shadow on unreadable (image) surface","headingFontSize":11,"kickerTag":"div","kickerText":"Soft neutral halo Achromatic zero-offset shadow is ambient elevation.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Offset chromatic shadow under a translucent gradient over an image","headingFontSize":11,"kickerTag":"div","kickerText":"Offset colored shadow over photo background Surface unknown, offset shadow — abstain, not flag.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Neutral text-shadow on dark card","headingFontSize":11,"kickerTag":"div","kickerText":"The wash blends with unknowable image pixels Surface unknown — abstain, never score the wash stops as dark.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Light elevated cards","headingFontSize":11,"kickerTag":"div","kickerText":"Offset neutral text-shadow Legibility aid, not a glow.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"Flag Crowded One","headingFontSize":28,"kickerTag":"p","kickerText":"A closing paragraph of the previous block of content, sitting directly above the crowded heading with no gap at all between them.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"Flag Crowded Two","headingFontSize":28,"kickerTag":"p","kickerText":"Another closing paragraph of a previous content block, again flush against the heading that follows it in the document flow.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Flag Crowded Three","headingFontSize":20,"kickerTag":"p","kickerText":"A third closing paragraph that the next heading will visually attach to, which is exactly the inversion this rule measures.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"Pass Generous Above","headingFontSize":28,"kickerTag":"p","kickerText":"Third crowded case, this time an h3, to confirm the rule reads h2 through h4.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"Pass Near Equal","headingFontSize":28,"kickerTag":"p","kickerText":"Sixty-four pixels above and sixteen below. The heading clearly binds to this paragraph, which is the healthy shape.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"Pass Eyebrow Cluster","headingFontSize":28,"kickerTag":"p","kickerText":"Chapter Four","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":12,"kickerLetterSpacing":1.2000000000000002}],"result":false}
|
|
{"args":[{"headingLevel":1,"headingText":"Eyebrow Above Hero","headingFontSize":88,"kickerTag":"div","kickerText":"AI-NATIVE WORKFLOWS","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":12,"kickerLetterSpacing":2.4}],"result":true}
|
|
{"args":[{"headingLevel":1,"headingText":"Span Eyebrow Above Hero","headingFontSize":88,"kickerTag":"span","kickerText":"NEW IN 2026","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":11,"kickerLetterSpacing":2.56}],"result":false}
|
|
{"args":[{"headingLevel":1,"headingText":"Pill Chip Above Hero","headingFontSize":88,"kickerTag":"span","kickerText":"FEATURED","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":12,"kickerLetterSpacing":2.24}],"result":true}
|
|
{"args":[{"headingLevel":1,"headingText":"Already Uppercase Text","headingFontSize":88,"kickerTag":"span","kickerText":"NEW","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":11,"kickerLetterSpacing":2.88}],"result":true}
|
|
{"args":[{"headingLevel":1,"headingText":"Long Uppercase Sentence Above Hero","headingFontSize":88,"kickerTag":"div","kickerText":"A VERY LONG UPPERCASE TABLE OF CONTENTS HEADER","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":12,"kickerLetterSpacing":2.24}],"result":false}
|
|
{"args":[{"headingLevel":1,"headingText":"Eyebrow With Normal Tracking","headingFontSize":88,"kickerTag":"div","kickerText":"UPPERCASE LABEL","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":12,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":1,"headingText":"Uppercase Caption Far From Hero","headingFontSize":88,"kickerTag":"p","kickerText":"Plain body text below the caption.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":14,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":1,"headingText":"Heading Above Heading","headingFontSize":88,"kickerTag":"h2","kickerText":"SECTION HEADING","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":14,"kickerLetterSpacing":2.52}],"result":false}
|
|
{"args":[{"headingLevel":1,"headingText":"Body-Sized Heading Below Eyebrow","headingFontSize":24,"kickerTag":"div","kickerText":"SECTION KICKER","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":12,"kickerLetterSpacing":2.4}],"result":true}
|
|
{"args":[{"headingLevel":3,"headingText":"Lightning Fast","headingFontSize":18,"kickerTag":"div","kickerText":"","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Secure Storage","headingFontSize":18,"kickerTag":"div","kickerText":"","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Easy Setup","headingFontSize":18,"kickerTag":"div","kickerText":"","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Powerful Analytics","headingFontSize":18,"kickerTag":"div","kickerText":"","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Emoji Inline Icon","headingFontSize":18,"kickerTag":"div","kickerText":"⚡","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":24,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Sarah Chen","headingFontSize":18,"kickerTag":"div","kickerText":"","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Article Headline","headingFontSize":18,"kickerTag":"div","kickerText":"","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Tiny Icon Above Me","headingFontSize":18,"kickerTag":"div","kickerText":"","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Huge Hero Image","headingFontSize":18,"kickerTag":"div","kickerText":"","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"\"A Single Kicker Still Flags\"","headingFontSize":32,"kickerTag":"span","kickerText":"Invitation protocol","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":12,"kickerLetterSpacing":1.32}],"result":true}
|
|
{"args":[{"headingLevel":2,"headingText":"\"Standard Tracking Kicker\"","headingFontSize":32,"kickerTag":"span","kickerText":"Output model","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":12,"kickerLetterSpacing":0.96}],"result":true}
|
|
{"args":[{"headingLevel":3,"headingText":"\"Kicker Above An H3\"","headingFontSize":24,"kickerTag":"p","kickerText":"Preview sequence","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":12,"kickerLetterSpacing":1.32}],"result":true}
|
|
{"args":[{"headingLevel":4,"headingText":"\"Kicker Above An H4\"","headingFontSize":20,"kickerTag":"div","kickerText":"Access window","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":12,"kickerLetterSpacing":1.32}],"result":true}
|
|
{"args":[{"headingLevel":1,"headingText":"\"Sub Hero Heading\"","headingFontSize":32,"kickerTag":"span","kickerText":"Platform notes","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":12,"kickerLetterSpacing":1.32}],"result":true}
|
|
{"args":[{"headingLevel":2,"headingText":"\"Small Caps Kicker\"","headingFontSize":32,"kickerTag":"span","kickerText":"materials briefing","kickerTextTransform":"none","kickerFontVariant":"small-caps ","kickerFontSize":12,"kickerLetterSpacing":1.44}],"result":true}
|
|
{"args":[{"headingLevel":2,"headingText":"\"Heading Role Kicker\"","headingFontSize":28,"kickerTag":"div","kickerText":"Field studies","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":12,"kickerLetterSpacing":1.32}],"result":true}
|
|
{"args":[{"headingLevel":2,"headingText":"\"Breadcrumb Trail Outside Nav\"","headingFontSize":32,"kickerTag":"span","kickerText":"Home / Journal / Archive","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":12,"kickerLetterSpacing":1.32}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"\"Dateline Above Headline\"","headingFontSize":32,"kickerTag":"span","kickerText":"News · Jan 12, 2026","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":12,"kickerLetterSpacing":1.32}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"\"Limitation Of Liability\"","headingFontSize":32,"kickerTag":"span","kickerText":"Section 4.2","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":12,"kickerLetterSpacing":1.32}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"\"Indemnification Clause\"","headingFontSize":32,"kickerTag":"span","kickerText":"§ 12.3","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":12,"kickerLetterSpacing":1.32}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"\"Chapter Numbering Passes\"","headingFontSize":32,"kickerTag":"span","kickerText":"Chapter Four","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":12,"kickerLetterSpacing":1.32}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"\"Sentence Case Lead In\"","headingFontSize":32,"kickerTag":"span","kickerText":"A quiet lead-in sentence","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":12,"kickerLetterSpacing":1.32}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"\"Untracked Caps Label\"","headingFontSize":32,"kickerTag":"span","kickerText":"New arrivals","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":12,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":1,"headingText":"\"Hero Owned By Hero Rule\"","headingFontSize":64,"kickerTag":"span","kickerText":"Platform overview","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":12,"kickerLetterSpacing":2}],"result":true}
|
|
{"args":[{"headingLevel":3,"headingText":"Nested cards (cardocalypse)","headingFontSize":11,"kickerTag":"h2","kickerText":"Should flag","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":14,"kickerLetterSpacing":0.7000000000000001}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"shadcn Card sub-components (not nested cards)","headingFontSize":11,"kickerTag":"h2","kickerText":"Should pass","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":14,"kickerLetterSpacing":0.7000000000000001}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Card with form inputs","headingFontSize":11,"kickerTag":"div","kickerText":"Card Title Card description goes here. CardContent — a sub-section, not a nested card. No shadow, no border-radius of its own. Action","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Card with code block","headingFontSize":11,"kickerTag":"div","kickerText":"Settings Select option","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Card with badges","headingFontSize":11,"kickerTag":"div","kickerText":"Installation npm install @acme/sdk","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Card with image","headingFontSize":11,"kickerTag":"div","kickerText":"Tags React TypeScript Tailwind","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":4,"headingText":"Project Preview","headingFontSize":16,"kickerTag":"div","kickerText":"","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Pricing cards (intentionally similar)","headingFontSize":11,"kickerTag":"div","kickerText":"Project Preview Image with rounded corners and shadow.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"Blockquotes","headingFontSize":18,"kickerTag":"p","kickerText":"Every border here is a well-established web pattern. None should be flagged.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"Sidebar Navigation (Active State)","headingFontSize":18,"kickerTag":"div","kickerText":"\"Design is not just what it looks like and feels like. Design is how it works.\"","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"Form Validation","headingFontSize":18,"kickerTag":"div","kickerText":"Dashboard Projects Settings","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"Timeline","headingFontSize":18,"kickerTag":"div","kickerText":"Email Please enter a valid email address.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"Code Diff Highlighting","headingFontSize":18,"kickerTag":"div","kickerText":"Order placed March 15, 2026 Shipped March 16, 2026 Delivered Expected March 18","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"Tab Navigation","headingFontSize":18,"kickerTag":"div","kickerText":"- const old = getValue(); + const value = getNewValue(); return value;","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"Data Table","headingFontSize":18,"kickerTag":"div","kickerText":"Overview Analytics Settings","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"Alert Banner","headingFontSize":18,"kickerTag":"div","kickerText":"Name Revenue Acme Corp$1.2M Globex$850K","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Bounce / elastic easing","headingFontSize":11,"kickerTag":"h2","kickerText":"Should flag","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":14,"kickerLetterSpacing":0.7000000000000001}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Layout property transitions","headingFontSize":11,"kickerTag":"div","kickerText":"Elastic cubic-bezier cubic-bezier(0.68, -0.55, 0.265, 1.55)","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Good easing","headingFontSize":11,"kickerTag":"h2","kickerText":"Should pass","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":14,"kickerLetterSpacing":0.7000000000000001}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Safe transitions (transform / opacity / color only)","headingFontSize":11,"kickerTag":"div","kickerText":"Ease-out expo cubic-bezier(0.16, 1, 0.3, 1) — natural feel","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"Alpha ships first","headingFontSize":28,"kickerTag":"span","kickerText":"01","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":11,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"Beta earns trust","headingFontSize":28,"kickerTag":"span","kickerText":"02","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":11,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"Delta closes the loop","headingFontSize":28,"kickerTag":"span","kickerText":"04 / ROLLOUT","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":12,"kickerLetterSpacing":2}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"Epsilon reads large","headingFontSize":28,"kickerTag":"span","kickerText":"05","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"Zeta stays plain","headingFontSize":28,"kickerTag":"span","kickerText":"12 · minute read","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":12,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"Eta walks steps","headingFontSize":28,"kickerTag":"span","kickerText":"Step 6","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":11,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"Theta counts casually","headingFontSize":28,"kickerTag":"span","kickerText":"7","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":11,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"1. Transform Ancestors","headingFontSize":18,"kickerTag":"p","kickerText":"Each scenario places a detectable anti-pattern inside a layout context that can cause overlay misalignment.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"2. Closed Details","headingFontSize":18,"kickerTag":"div","kickerText":"1e. Transform + absolute child Absolutely positioned tiny text inside transformed parent.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"3. Sticky and Fixed Positioning","headingFontSize":18,"kickerTag":"div","kickerText":"2d. Transform inside closed details Closed with transform inside Tiny text inside transform inside closed details. Double trouble.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"4. Overflow Hidden","headingFontSize":18,"kickerTag":"div","kickerText":"Tiny text in a fixed footer -- overlay should track this on scroll.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"5. Position Offsets","headingFontSize":18,"kickerTag":"div","kickerText":"4b. overflow:hidden + transform ancestor Visible inside transform + overflow. Clipped tiny text inside a transformed overflow:hidden container.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"6. Flex and Grid Centering","headingFontSize":18,"kickerTag":"div","kickerText":"5c. Negative top offset Tiny text pulled upward via negative top offset.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"7. Containing Block Creators","headingFontSize":18,"kickerTag":"div","kickerText":"6c. Flex with transform AI Gradient Button in Flex + Transform","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"8. Margin Collapse and Negative Margins","headingFontSize":18,"kickerTag":"div","kickerText":"7d. backdrop-filter Tiny text inside a backdrop-filter container.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"9. Combined Edge Cases","headingFontSize":18,"kickerTag":"div","kickerText":"8a. Negative margin shifting element position Tiny text pulled out of its parent via negative margins.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":1,"headingText":"The missing design vocabulary for agents.","headingFontSize":83,"kickerTag":"h1","kickerText":"A sweeping product headline that sprawls across the whole viewport and keeps going","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":104,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":1,"headingText":"Everything your whole team needs to launch quickly and finally rest at night","headingFontSize":80,"kickerTag":"h1","kickerText":"A sweeping product headline that runs on far too long to sit at this size","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":96,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":1,"headingText":"Ship faster","headingFontSize":120,"kickerTag":"h1","kickerText":"Bold.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":168,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":1,"headingText":"A perfectly ordinary headline that is reasonably long but set at a sane, readable size","headingFontSize":40,"kickerTag":"h1","kickerText":"Ship faster","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":120,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"Heading","headingFontSize":16,"kickerTag":"div","kickerText":"Panel","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Line length too long","headingFontSize":11,"kickerTag":"h2","kickerText":"Should flag","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":14,"kickerLetterSpacing":0.7000000000000001}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Tight line height","headingFontSize":11,"kickerTag":"div","kickerText":"no max-width on a paragraph This paragraph has no max-width constraint at all, which means on a wide monitor or ultrawide display, each line of text can stretch to 150 or even 200 characters wide. Research consistently shows that line lengths beyond 75 characters significantly reduce reading speed and comprehension. The eye has to travel too far to find the beginning of the next line, causing readers to lose their place. A simple max-width of 65ch to 75ch on the paragraph or its container would fix this entirely.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Tiny body text","headingFontSize":11,"kickerTag":"div","kickerText":"line-height: 1.0 This paragraph has a line-height of 1.0, which means the lines are touching. Multi-line body text needs breathing room between lines for readability. A line-height of 1.5 to 1.7 is generally recommended for body text.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Justified text without hyphens","headingFontSize":11,"kickerTag":"div","kickerText":"10px body text This body text is only 10px. While this might be fine for a disclaimer or legal footnote, it's too small for primary content that users need to actually read. Aim for at least 14px for body content, 16px is ideal.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"All-caps body text","headingFontSize":11,"kickerTag":"div","kickerText":"text-align: justify, no hyphens: auto This paragraph uses text-align: justify, which forces each line to stretch to fill the full width. Without hyphenation support, this creates uneven gaps between words known as \"rivers of white space\" that flow vertically through the text. Left-aligned text is almost always more readable on the web.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Wide letter spacing on body text","headingFontSize":11,"kickerTag":"div","kickerText":"text-transform: uppercase on a long passage This entire paragraph is in uppercase via text-transform. While all-caps works for short labels, headings, or navigation items, longer body text in uppercase is significantly harder to read because we lose the word shape cues that come from ascenders and descenders in mixed-case text.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Skipped heading levels","headingFontSize":11,"kickerTag":"div","kickerText":"letter-spacing: 0.15em on body text This body text has letter-spacing: 0.15em applied to it. While subtle tracking adjustments can improve readability for headings or all-caps text, adding significant letter spacing to body text actually makes it harder to read by disrupting natural character groupings.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":1,"headingText":"Top heading","headingFontSize":20,"kickerTag":"span","kickerText":"h1 → h3 (missing h2)","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":12,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Skips straight to h3","headingFontSize":16,"kickerTag":"h1","kickerText":"Top heading","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":20,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Comfortable line length","headingFontSize":11,"kickerTag":"h2","kickerText":"Should pass","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":14,"kickerLetterSpacing":0.7000000000000001}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Comfortable line height","headingFontSize":11,"kickerTag":"div","kickerText":"max-width: 65ch on the paragraph This paragraph has a max-width of 65ch, keeping the line length comfortable for reading. The eye can easily track from the end of one line to the beginning of the next without losing its place.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Comfortable body text size","headingFontSize":11,"kickerTag":"div","kickerText":"line-height: 1.6 This paragraph has a line-height of 1.6, which gives multi-line text plenty of room to breathe and improves the rhythm of the page.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Justified text with hyphens","headingFontSize":11,"kickerTag":"div","kickerText":"16px body text This is 16px body text — the recommended baseline for comfortable reading on modern displays.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Short label in all-caps","headingFontSize":11,"kickerTag":"div","kickerText":"text-align: justify + hyphens: auto When justified text is paired with hyphens: auto, the browser can break long words across lines, eliminating the rivers of white space and making the justification look intentional rather than awkward.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Wide tracking on a short uppercase label","headingFontSize":11,"kickerTag":"div","kickerText":"short label, uppercase Featured","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Proper heading hierarchy","headingFontSize":11,"kickerTag":"div","kickerText":"letter-spacing on a short uppercase label Beta","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":1,"headingText":"Top heading","headingFontSize":20,"kickerTag":"span","kickerText":"h1 → h2 → h3","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":12,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"Second level","headingFontSize":18,"kickerTag":"h1","kickerText":"Top heading","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":20,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Third level","headingFontSize":16,"kickerTag":"h2","kickerText":"Second level","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":18,"kickerLetterSpacing":0.9}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Small mockup metadata","headingFontSize":11,"kickerTag":"div","kickerText":"h1 → h2 → h3 Top heading Second level Third level","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"Tailwind Side-Tab","headingFontSize":14,"kickerTag":"p","kickerText":"Every example on this page should be detected by the anti-pattern scanner.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"CSS Side-Tab","headingFontSize":14,"kickerTag":"div","kickerText":"border-l-4 + rounded-r The classic AI tell. border-r-4 + rounded-l Right side variant. border-e-8 + rounded-l Logical inline-end, extra thick.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"Top/Bottom + Rounded","headingFontSize":14,"kickerTag":"div","kickerText":"border-left: 4px solid CSS shorthand. border-right: 5px solid CSS shorthand right. border-left-width: 3px CSS longhand. border-right-width: 6px CSS longhand right.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"Dark Mode","headingFontSize":14,"kickerTag":"div","kickerText":"border-t-4 + rounded-lg Top accent on rounded card. border-b-4 + rounded-xl Bottom accent on rounded card. border-t-2 + rounded-md Even thin top border on rounded. CSS border-top + border-radius Top border from style block. CSS border-bottom + border-radius Bottom border from style block.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"Clean Cards","headingFontSize":18,"kickerTag":"p","kickerText":"None of these should be flagged. They're all intentional, well-established web patterns.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"No border at all","headingFontSize":16,"kickerTag":"span","kickerText":"New","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":12,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"Below Threshold (Thin, No Radius)","headingFontSize":18,"kickerTag":"div","kickerText":"Full border card Subtle 1px border all around. Clean and intentional. Top border, no radius A hairline top rule without rounded corners is a clean section divider. Bottom border, no radius Bottom accent without rounded corners is also clean. New No border at all Just a shadow. Simple and effective.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"Dark Mode (Clean)","headingFontSize":18,"kickerTag":"div","kickerText":"border-left: 1px solid, no radius — not flagged border-right: 2px solid, no radius — not flagged 1px inline border-left, no radius — not flagged","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":1,"headingText":"Trattoria da Nonna Lucia","headingFontSize":96,"kickerTag":"p","kickerText":"Family Italian on the waterfront","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":14,"kickerLetterSpacing":1.4000000000000001}],"result":true}
|
|
{"args":[{"headingLevel":2,"headingText":"1. Overused Font","headingFontSize":16,"kickerTag":"p","kickerText":"This page triggers three typography detections:","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":14,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"2. Single Font","headingFontSize":16,"kickerTag":"p","kickerText":"Inter is loaded from Google Fonts and set as the only font-family. It's the most common AI default.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":14,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"3. Flat Type Hierarchy","headingFontSize":16,"kickerTag":"p","kickerText":"There's no second font for headings or display text. Everything uses Inter — no typographic variety.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":14,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"A Subheading","headingFontSize":15,"kickerTag":"p","kickerText":"This caption is barely distinguishable from body text.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":13,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"Two Font Families","headingFontSize":32,"kickerTag":"p","kickerText":"This page uses distinctive fonts, proper pairing, and strong hierarchy.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Strong Size Hierarchy","headingFontSize":24,"kickerTag":"p","kickerText":"Newsreader (serif) for headings, Karla for body. Clear contrast in both structure and personality, and neither face has been adopted into the current AI-default monoculture.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"Tailwind Side-Tab","headingFontSize":14,"kickerTag":"p","kickerText":"Every example on this page should be detected by the anti-pattern scanner.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"CSS Side-Tab","headingFontSize":14,"kickerTag":"div","kickerText":"border-l-4 + rounded-r The classic AI tell. border-r-4 + rounded-l Right side variant. border-e-8 + rounded-l Logical inline-end, extra thick.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"Top/Bottom + Rounded","headingFontSize":14,"kickerTag":"div","kickerText":"border-left: 4px solid CSS shorthand. border-right: 5px solid CSS shorthand right. border-left-width: 3px CSS longhand. border-right-width: 6px CSS longhand right.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"Dark Mode","headingFontSize":14,"kickerTag":"div","kickerText":"border-t-4 + rounded-lg Top accent on rounded card. border-b-4 + rounded-xl Bottom accent on rounded card. border-t-2 + rounded-md Even thin top border on rounded. CSS border-top + border-radius Top border from style block. CSS border-bottom + border-radius Bottom border from style block.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"Clean Cards","headingFontSize":18,"kickerTag":"p","kickerText":"None of these should be flagged. They're all intentional, well-established web patterns.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"No border at all","headingFontSize":16,"kickerTag":"span","kickerText":"New","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":12,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"Below Threshold (Thin, No Radius)","headingFontSize":18,"kickerTag":"div","kickerText":"Full border card Subtle 1px border all around. Clean and intentional. Top border, no radius A hairline top rule without rounded corners is a clean section divider. Bottom border, no radius Bottom accent without rounded corners is also clean. New No border at all Just a shadow. Simple and effective.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"Dark Mode (Clean)","headingFontSize":18,"kickerTag":"div","kickerText":"border-left: 1px solid, no radius — not flagged border-right: 2px solid, no radius — not flagged 1px inline border-left, no radius — not flagged","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Pure black surfaces","headingFontSize":11,"kickerTag":"h2","kickerText":"Should flag","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":14,"kickerLetterSpacing":0.7000000000000001}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Gray on color","headingFontSize":11,"kickerTag":"div","kickerText":"Pure #000 background","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Low contrast","headingFontSize":11,"kickerTag":"div","kickerText":"Gray text on green background","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Gradient text","headingFontSize":11,"kickerTag":"div","kickerText":"Welcome to Our Platform The best solution for modern teams and businesses","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Gradient Heading","headingFontSize":24,"kickerTag":"h3","kickerText":"Gradient text","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":11,"kickerLetterSpacing":0.55}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"AI color palette","headingFontSize":11,"kickerTag":"h3","kickerText":"Gradient Heading","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":24,"kickerLetterSpacing":1.2000000000000002}],"result":false}
|
|
{"args":[{"headingLevel":1,"headingText":"Purple heading text","headingFontSize":24,"kickerTag":"h3","kickerText":"AI color palette","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":11,"kickerLetterSpacing":0.55}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Styled <a> and <button> with low contrast","headingFontSize":11,"kickerTag":"h1","kickerText":"Purple heading text","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":24,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Text-bearing chip with low contrast","headingFontSize":11,"kickerTag":"button","kickerText":"Submit","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":14,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Tailwind color anti-patterns","headingFontSize":11,"kickerTag":"span","kickerText":"SEV-2","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":11,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"text-purple-500 heading","headingFontSize":24,"kickerTag":"div","kickerText":"text-gray-400 on bg-blue-500 — gray on color","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"currentcolor surface via var() token","headingFontSize":11,"kickerTag":"div","kickerText":"Purple-to-indigo gradient","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Tinted neutrals","headingFontSize":11,"kickerTag":"h2","kickerText":"Should pass","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":14,"kickerLetterSpacing":0.7000000000000001}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Pure white surface is acceptable","headingFontSize":11,"kickerTag":"div","kickerText":"Near-white bg, near-black text — good contrast, tinted","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Good contrast","headingFontSize":11,"kickerTag":"div","kickerText":"Pure #fff background with dark text — acceptable contrast","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Distinctive accents (not AI purple)","headingFontSize":11,"kickerTag":"div","kickerText":"Dark green text on green bg — same hue family","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Red heading — not AI purple","headingFontSize":20,"kickerTag":"h3","kickerText":"Distinctive accents (not AI purple)","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":11,"kickerLetterSpacing":0.55}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Amber heading — distinctive","headingFontSize":20,"kickerTag":"h3","kickerText":"Red heading — not AI purple","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":20,"kickerLetterSpacing":1}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Background-image url() ancestor (not low contrast)","headingFontSize":11,"kickerTag":"h3","kickerText":"Amber heading — distinctive","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":20,"kickerLetterSpacing":1}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Tailwind opacity-modified bg-black (not pure black)","headingFontSize":11,"kickerTag":"div","kickerText":"White text on image background — should not flag low-contrast","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Inline <a> without own background (must remain skipped)","headingFontSize":11,"kickerTag":"div","kickerText":"bg-black/50 — 50% opacity, not pure black","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Styled <a> with good contrast (must not flag)","headingFontSize":11,"kickerTag":"p","kickerText":"Read more about this if you want to learn more about the topic.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Chip with good contrast (must not flag)","headingFontSize":11,"kickerTag":"a","kickerText":"High contrast pill","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":14,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Sub-9px decorative chip (below the font floor, must not flag)","headingFontSize":11,"kickerTag":"span","kickerText":"HEALTHY","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":11,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"background: none resets an earlier background-color","headingFontSize":11,"kickerTag":"span","kickerText":"tick","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":8,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Gradient-clipped text (issue #409 Case A — must not flag contrast)","headingFontSize":11,"kickerTag":"div","kickerText":"light text over the dark panel, not the light code surface","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":1,"headingText":"Gradient Clipped Heading Text","headingFontSize":40,"kickerTag":"h3","kickerText":"Gradient-clipped text (issue #409 Case A — must not flag contrast)","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":11,"kickerLetterSpacing":0.55}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Faint accent-glow gradient (issue #409 Case B — must not flag contrast)","headingFontSize":11,"kickerTag":"h1","kickerText":"Gradient Clipped Heading Text","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":40,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"color-mix gradient stop: nested ingredient is not a surface","headingFontSize":11,"kickerTag":"div","kickerText":"Light body copy on a faint accent glow that composites to near-black Muted secondary line on the same faint glow area here","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"currentcolor surface with good contrast","headingFontSize":11,"kickerTag":"div","kickerText":"Light copy on a faint mixed wash over a dark ground stays readable","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"currentcolor surface with unresolvable token (must abstain)","headingFontSize":11,"kickerTag":"div","kickerText":"Dark ink text on a bone currentcolor surface","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Emoji on light backgrounds","headingFontSize":11,"kickerTag":"div","kickerText":"Light text on an unknowable currentcolor surface","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"Blockquotes","headingFontSize":18,"kickerTag":"p","kickerText":"Every border here is a well-established web pattern. None should be flagged.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"Sidebar Navigation (Active State)","headingFontSize":18,"kickerTag":"div","kickerText":"\"Design is not just what it looks like and feels like. Design is how it works.\"","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"Form Validation","headingFontSize":18,"kickerTag":"div","kickerText":"Dashboard Projects Settings","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"Timeline","headingFontSize":18,"kickerTag":"div","kickerText":"Email Please enter a valid email address.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"Code Diff Highlighting","headingFontSize":18,"kickerTag":"div","kickerText":"Order placed March 15, 2026 Shipped March 16, 2026 Delivered Expected March 18","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"Tab Navigation","headingFontSize":18,"kickerTag":"div","kickerText":"- const old = getValue(); + const value = getNewValue(); return value;","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"Data Table","headingFontSize":18,"kickerTag":"div","kickerText":"Overview Analytics Settings","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"Alert Banner","headingFontSize":18,"kickerTag":"div","kickerText":"Name Revenue Acme Corp$1.2M Globex$850K","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"1. Overused Font","headingFontSize":16,"kickerTag":"p","kickerText":"This page triggers three typography detections:","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":14,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"2. Single Font","headingFontSize":16,"kickerTag":"p","kickerText":"Inter is loaded from Google Fonts and set as the only font-family. It's the most common AI default.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":14,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"3. Flat Type Hierarchy","headingFontSize":16,"kickerTag":"p","kickerText":"There's no second font for headings or display text. Everything uses Inter — no typographic variety.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":14,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"A Subheading","headingFontSize":15,"kickerTag":"p","kickerText":"This caption is barely distinguishable from body text.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":13,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"Two Font Families","headingFontSize":32,"kickerTag":"p","kickerText":"This page uses distinctive fonts, proper pairing, and strong hierarchy.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Strong Size Hierarchy","headingFontSize":24,"kickerTag":"p","kickerText":"Newsreader (serif) for headings, Karla for body. Clear contrast in both structure and personality, and neither face has been adopted into the current AI-default monoculture.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"Alpha ships first","headingFontSize":28,"kickerTag":"span","kickerText":"01","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":11,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"Beta earns trust","headingFontSize":28,"kickerTag":"span","kickerText":"02","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":11,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"Delta closes the loop","headingFontSize":28,"kickerTag":"span","kickerText":"04 / ROLLOUT","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":12,"kickerLetterSpacing":2}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"Epsilon reads large","headingFontSize":28,"kickerTag":"span","kickerText":"05","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"Zeta stays plain","headingFontSize":28,"kickerTag":"span","kickerText":"12 · minute read","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":12,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"Eta walks steps","headingFontSize":28,"kickerTag":"span","kickerText":"Step 6","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":11,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"Theta counts casually","headingFontSize":28,"kickerTag":"span","kickerText":"7","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":11,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Lightning Fast","headingFontSize":18,"kickerTag":"div","kickerText":"","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Secure Storage","headingFontSize":18,"kickerTag":"div","kickerText":"","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Easy Setup","headingFontSize":18,"kickerTag":"div","kickerText":"","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Powerful Analytics","headingFontSize":18,"kickerTag":"div","kickerText":"","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Emoji Inline Icon","headingFontSize":18,"kickerTag":"div","kickerText":"⚡","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":24,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Sarah Chen","headingFontSize":18,"kickerTag":"div","kickerText":"","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Article Headline","headingFontSize":18,"kickerTag":"div","kickerText":"","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Tiny Icon Above Me","headingFontSize":18,"kickerTag":"div","kickerText":"","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Huge Hero Image","headingFontSize":18,"kickerTag":"div","kickerText":"","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Line length too long","headingFontSize":11,"kickerTag":"h2","kickerText":"Should flag","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":14,"kickerLetterSpacing":0.7000000000000001}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Tight line height","headingFontSize":11,"kickerTag":"div","kickerText":"no max-width on a paragraph This paragraph has no max-width constraint at all, which means on a wide monitor or ultrawide display, each line of text can stretch to 150 or even 200 characters wide. Research consistently shows that line lengths beyond 75 characters significantly reduce reading speed and comprehension. The eye has to travel too far to find the beginning of the next line, causing readers to lose their place. A simple max-width of 65ch to 75ch on the paragraph or its container would fix this entirely.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Tiny body text","headingFontSize":11,"kickerTag":"div","kickerText":"line-height: 1.0 This paragraph has a line-height of 1.0, which means the lines are touching. Multi-line body text needs breathing room between lines for readability. A line-height of 1.5 to 1.7 is generally recommended for body text.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Justified text without hyphens","headingFontSize":11,"kickerTag":"div","kickerText":"10px body text This body text is only 10px. While this might be fine for a disclaimer or legal footnote, it's too small for primary content that users need to actually read. Aim for at least 14px for body content, 16px is ideal.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"All-caps body text","headingFontSize":11,"kickerTag":"div","kickerText":"text-align: justify, no hyphens: auto This paragraph uses text-align: justify, which forces each line to stretch to fill the full width. Without hyphenation support, this creates uneven gaps between words known as \"rivers of white space\" that flow vertically through the text. Left-aligned text is almost always more readable on the web.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Wide letter spacing on body text","headingFontSize":11,"kickerTag":"div","kickerText":"text-transform: uppercase on a long passage This entire paragraph is in uppercase via text-transform. While all-caps works for short labels, headings, or navigation items, longer body text in uppercase is significantly harder to read because we lose the word shape cues that come from ascenders and descenders in mixed-case text.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Skipped heading levels","headingFontSize":11,"kickerTag":"div","kickerText":"letter-spacing: 0.15em on body text This body text has letter-spacing: 0.15em applied to it. While subtle tracking adjustments can improve readability for headings or all-caps text, adding significant letter spacing to body text actually makes it harder to read by disrupting natural character groupings.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":1,"headingText":"Top heading","headingFontSize":20,"kickerTag":"span","kickerText":"h1 → h3 (missing h2)","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":12,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Skips straight to h3","headingFontSize":16,"kickerTag":"h1","kickerText":"Top heading","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":20,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Comfortable line length","headingFontSize":11,"kickerTag":"h2","kickerText":"Should pass","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":14,"kickerLetterSpacing":0.7000000000000001}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Comfortable line height","headingFontSize":11,"kickerTag":"div","kickerText":"max-width: 65ch on the paragraph This paragraph has a max-width of 65ch, keeping the line length comfortable for reading. The eye can easily track from the end of one line to the beginning of the next without losing its place.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Comfortable body text size","headingFontSize":11,"kickerTag":"div","kickerText":"line-height: 1.6 This paragraph has a line-height of 1.6, which gives multi-line text plenty of room to breathe and improves the rhythm of the page.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Justified text with hyphens","headingFontSize":11,"kickerTag":"div","kickerText":"16px body text This is 16px body text — the recommended baseline for comfortable reading on modern displays.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Short label in all-caps","headingFontSize":11,"kickerTag":"div","kickerText":"text-align: justify + hyphens: auto When justified text is paired with hyphens: auto, the browser can break long words across lines, eliminating the rivers of white space and making the justification look intentional rather than awkward.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Wide tracking on a short uppercase label","headingFontSize":11,"kickerTag":"div","kickerText":"short label, uppercase Featured","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Proper heading hierarchy","headingFontSize":11,"kickerTag":"div","kickerText":"letter-spacing on a short uppercase label Beta","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":1,"headingText":"Top heading","headingFontSize":20,"kickerTag":"span","kickerText":"h1 → h2 → h3","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":12,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"Second level","headingFontSize":18,"kickerTag":"h1","kickerText":"Top heading","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":20,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Third level","headingFontSize":16,"kickerTag":"h2","kickerText":"Second level","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":18,"kickerLetterSpacing":0.9}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Small mockup metadata","headingFontSize":11,"kickerTag":"div","kickerText":"h1 → h2 → h3 Top heading Second level Third level","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Nested cards (cardocalypse)","headingFontSize":11,"kickerTag":"h2","kickerText":"Should flag","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":14,"kickerLetterSpacing":0.7000000000000001}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"shadcn Card sub-components (not nested cards)","headingFontSize":11,"kickerTag":"h2","kickerText":"Should pass","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":14,"kickerLetterSpacing":0.7000000000000001}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Card with form inputs","headingFontSize":11,"kickerTag":"div","kickerText":"Card Title Card description goes here. CardContent — a sub-section, not a nested card. No shadow, no border-radius of its own. Action","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Card with code block","headingFontSize":11,"kickerTag":"div","kickerText":"Settings Select option","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Card with badges","headingFontSize":11,"kickerTag":"div","kickerText":"Installation npm install @acme/sdk","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Card with image","headingFontSize":11,"kickerTag":"div","kickerText":"Tags React TypeScript Tailwind","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":4,"headingText":"Project Preview","headingFontSize":16,"kickerTag":"div","kickerText":"","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Pricing cards (intentionally similar)","headingFontSize":11,"kickerTag":"div","kickerText":"Project Preview Image with rounded corners and shadow.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":1,"headingText":"Eyebrow Above Hero","headingFontSize":88,"kickerTag":"div","kickerText":"AI-NATIVE WORKFLOWS","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":12,"kickerLetterSpacing":2.4}],"result":true}
|
|
{"args":[{"headingLevel":1,"headingText":"Span Eyebrow Above Hero","headingFontSize":88,"kickerTag":"span","kickerText":"NEW IN 2026","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":11,"kickerLetterSpacing":2.56}],"result":false}
|
|
{"args":[{"headingLevel":1,"headingText":"Pill Chip Above Hero","headingFontSize":88,"kickerTag":"span","kickerText":"FEATURED","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":12,"kickerLetterSpacing":2.24}],"result":true}
|
|
{"args":[{"headingLevel":1,"headingText":"Already Uppercase Text","headingFontSize":88,"kickerTag":"span","kickerText":"NEW","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":11,"kickerLetterSpacing":2.88}],"result":true}
|
|
{"args":[{"headingLevel":1,"headingText":"Long Uppercase Sentence Above Hero","headingFontSize":88,"kickerTag":"div","kickerText":"A VERY LONG UPPERCASE TABLE OF CONTENTS HEADER","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":12,"kickerLetterSpacing":2.24}],"result":false}
|
|
{"args":[{"headingLevel":1,"headingText":"Eyebrow With Normal Tracking","headingFontSize":88,"kickerTag":"div","kickerText":"UPPERCASE LABEL","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":12,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":1,"headingText":"Uppercase Caption Far From Hero","headingFontSize":88,"kickerTag":"p","kickerText":"Plain body text below the caption.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":14,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":1,"headingText":"Heading Above Heading","headingFontSize":88,"kickerTag":"h2","kickerText":"SECTION HEADING","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":14,"kickerLetterSpacing":2.52}],"result":false}
|
|
{"args":[{"headingLevel":1,"headingText":"Body-Sized Heading Below Eyebrow","headingFontSize":24,"kickerTag":"div","kickerText":"SECTION KICKER","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":12,"kickerLetterSpacing":2.4}],"result":true}
|
|
{"args":[{"headingLevel":2,"headingText":"\"A Single Kicker Still Flags\"","headingFontSize":32,"kickerTag":"span","kickerText":"Invitation protocol","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":12,"kickerLetterSpacing":1.32}],"result":true}
|
|
{"args":[{"headingLevel":2,"headingText":"\"Standard Tracking Kicker\"","headingFontSize":32,"kickerTag":"span","kickerText":"Output model","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":12,"kickerLetterSpacing":0.96}],"result":true}
|
|
{"args":[{"headingLevel":3,"headingText":"\"Kicker Above An H3\"","headingFontSize":24,"kickerTag":"p","kickerText":"Preview sequence","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":12,"kickerLetterSpacing":1.32}],"result":true}
|
|
{"args":[{"headingLevel":4,"headingText":"\"Kicker Above An H4\"","headingFontSize":20,"kickerTag":"div","kickerText":"Access window","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":12,"kickerLetterSpacing":1.32}],"result":true}
|
|
{"args":[{"headingLevel":1,"headingText":"\"Sub Hero Heading\"","headingFontSize":32,"kickerTag":"span","kickerText":"Platform notes","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":12,"kickerLetterSpacing":1.32}],"result":true}
|
|
{"args":[{"headingLevel":2,"headingText":"\"Small Caps Kicker\"","headingFontSize":32,"kickerTag":"span","kickerText":"materials briefing","kickerTextTransform":"none","kickerFontVariant":"small-caps ","kickerFontSize":12,"kickerLetterSpacing":1.44}],"result":true}
|
|
{"args":[{"headingLevel":2,"headingText":"\"Heading Role Kicker\"","headingFontSize":28,"kickerTag":"div","kickerText":"Field studies","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":12,"kickerLetterSpacing":1.32}],"result":true}
|
|
{"args":[{"headingLevel":2,"headingText":"\"Breadcrumb Trail Outside Nav\"","headingFontSize":32,"kickerTag":"span","kickerText":"Home / Journal / Archive","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":12,"kickerLetterSpacing":1.32}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"\"Dateline Above Headline\"","headingFontSize":32,"kickerTag":"span","kickerText":"News · Jan 12, 2026","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":12,"kickerLetterSpacing":1.32}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"\"Limitation Of Liability\"","headingFontSize":32,"kickerTag":"span","kickerText":"Section 4.2","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":12,"kickerLetterSpacing":1.32}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"\"Indemnification Clause\"","headingFontSize":32,"kickerTag":"span","kickerText":"§ 12.3","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":12,"kickerLetterSpacing":1.32}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"\"Chapter Numbering Passes\"","headingFontSize":32,"kickerTag":"span","kickerText":"Chapter Four","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":12,"kickerLetterSpacing":1.32}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"\"Sentence Case Lead In\"","headingFontSize":32,"kickerTag":"span","kickerText":"A quiet lead-in sentence","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":12,"kickerLetterSpacing":1.32}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"\"Untracked Caps Label\"","headingFontSize":32,"kickerTag":"span","kickerText":"New arrivals","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":12,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":1,"headingText":"\"Hero Owned By Hero Rule\"","headingFontSize":64,"kickerTag":"span","kickerText":"Platform overview","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":12,"kickerLetterSpacing":2}],"result":true}
|
|
{"args":[{"headingLevel":3,"headingText":"Bounce / elastic easing","headingFontSize":11,"kickerTag":"h2","kickerText":"Should flag","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":14,"kickerLetterSpacing":0.7000000000000001}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Layout property transitions","headingFontSize":11,"kickerTag":"div","kickerText":"Elastic cubic-bezier cubic-bezier(0.68, -0.55, 0.265, 1.55)","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Good easing","headingFontSize":11,"kickerTag":"h2","kickerText":"Should pass","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":14,"kickerLetterSpacing":0.7000000000000001}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Safe transitions (transform / opacity / color only)","headingFontSize":11,"kickerTag":"div","kickerText":"Ease-out expo cubic-bezier(0.16, 1, 0.3, 1) — natural feel","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"CSS colored glows on dark background","headingFontSize":11,"kickerTag":"h2","kickerText":"Should flag","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":14,"kickerLetterSpacing":0.7000000000000001}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Inline-style glow (regex path)","headingFontSize":11,"kickerTag":"div","kickerText":"Blue glow box-shadow: 0 0 20px rgba(59, 130, 246, 0.4) Purple glow box-shadow: 0 0 25px rgba(139, 92, 246, 0.35) Cyan glow box-shadow: 0 0 15px rgba(6, 182, 212, 0.5) Multi-shadow with colored glow Normal shadow + purple glow combined.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Modern color formats, var() refs, text-shadow","headingFontSize":11,"kickerTag":"div","kickerText":"Inline pink glow Inline style for regex detection path.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Zero-offset halo on LIGHT background","headingFontSize":11,"kickerTag":"div","kickerText":"OKLCH glow box-shadow: 0 0 18px oklch(0.72 0.15 195 / 0.5) Hex glow box-shadow: 0 0 16px #3b82f6 HSL glow box-shadow: 0 0 22px hsl(280, 80%, 60%) Glow via var() box-shadow: 0 0 10px var(--fixture-glow) Glowing text text-shadow: 0 0 12px #22d3ee on the heading.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Zero-offset halo on unreadable (image) surface","headingFontSize":11,"kickerTag":"div","kickerText":"Chromatic halo on light page box-shadow: 0 0 20px oklch(0.65 0.2 300 / 0.45)","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Colored glow under an opaque gradient over an image (browser)","headingFontSize":11,"kickerTag":"div","kickerText":"Halo over photo background box-shadow: 0 0 26px rgba(217, 70, 239, 0.5)","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Light page + colored shadow","headingFontSize":11,"kickerTag":"h2","kickerText":"Should pass","kickerTextTransform":"uppercase","kickerFontVariant":"normal ","kickerFontSize":14,"kickerLetterSpacing":0.7000000000000001}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Dark cards with neutral shadows","headingFontSize":11,"kickerTag":"div","kickerText":"Colored shadow on light background Not dark mode, colored shadow is fine.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Medium-gray background (not dark enough)","headingFontSize":11,"kickerTag":"div","kickerText":"Normal gray shadow on dark card Gray/black shadow is not a glow. Focus ring (spread, no blur) Functional ring, not decorative glow. Tiny blur (<5px) Too subtle to be \"glowing\". Small dark elevation Subtle shadow on dark card. Medium dark elevation Standard dark card shadow. Large dark elevation Prominent shadow on dark card. Inset shadow Inner shadow, not a glow. Multi-shadow dark card Layered gray shadows, no color glow.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Colored drop shadow / neutral halo on light background","headingFontSize":11,"kickerTag":"div","kickerText":"Not dark enough background Medium gray doesn't qualify as \"dark mode\".","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Offset chromatic shadow on unreadable (image) surface","headingFontSize":11,"kickerTag":"div","kickerText":"Soft neutral halo Achromatic zero-offset shadow is ambient elevation.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Offset chromatic shadow under a translucent gradient over an image","headingFontSize":11,"kickerTag":"div","kickerText":"Offset colored shadow over photo background Surface unknown, offset shadow — abstain, not flag.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Neutral text-shadow on dark card","headingFontSize":11,"kickerTag":"div","kickerText":"The wash blends with unknowable image pixels Surface unknown — abstain, never score the wash stops as dark.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Light elevated cards","headingFontSize":11,"kickerTag":"div","kickerText":"Offset neutral text-shadow Legibility aid, not a glow.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Border + zero side-padding","headingFontSize":13,"kickerTag":"h2","kickerText":"Should flag","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":22,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"All sides flush against a border","headingFontSize":13,"kickerTag":"div","kickerText":"section: full border, padding 28px 0 0; label and pills touch the left/right border lines. Supported dev servers Vite Next.js SvelteKit Astro","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Background color, zero padding","headingFontSize":13,"kickerTag":"div","kickerText":"card: 1px border on all sides, padding 0; heading and body touch every side. Card flush against the borders Body copy sits flush against every visible border line.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Outline (not border), zero padding","headingFontSize":13,"kickerTag":"div","kickerText":"no border, but a non-transparent bg; text flush against the bg's edge counts too. Title flush against the bg edge Body copy with zero padding around a colored fill.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Left-side flush, other sides fine","headingFontSize":13,"kickerTag":"div","kickerText":"outline draws outside the box; content at the box edge sits next to the outline. Title flush against the outline The outline counts as a visible boundary too.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"No boundary at all","headingFontSize":13,"kickerTag":"h2","kickerText":"Should pass","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":22,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Top-only border, no side borders","headingFontSize":13,"kickerTag":"div","kickerText":"no bg, no border, no outline; zero padding is fine. Supported dev servers Vite Next.js SvelteKit","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Bordered card with proper inset","headingFontSize":13,"kickerTag":"div","kickerText":"border-top only, padding-top 24px; no left/right border to be flush against. Supported dev servers Vite Next.js SvelteKit","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Background card with proper inset","headingFontSize":13,"kickerTag":"div","kickerText":"card: 1px border + padding 18px 20px; comfortable inset on every side. Card with proper inset Body copy sits comfortably away from the borders.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Outline with proper inset","headingFontSize":13,"kickerTag":"div","kickerText":"non-transparent bg + padding 14px 18px; content has room to breathe. Title with inset on bg Body copy is comfortably inset from the bg edge.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Image-only container, no text","headingFontSize":13,"kickerTag":"div","kickerText":"outline + padding 14px 18px; content is comfortably inside. Title with inset and outline Outline boundary with proper inset works.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Child margins provide the inset","headingFontSize":13,"kickerTag":"div","kickerText":"card: padding 0, border all sides; no text means nothing can be flush.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Inner shell provides the inset","headingFontSize":13,"kickerTag":"div","kickerText":"card: parent padding 0, but text children have margins that create visible inset. Title inset by child margin Body copy is not visually flush even though the parent has zero padding.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Same background as parent","headingFontSize":13,"kickerTag":"div","kickerText":"card: parent padding 0, but an inner shell is offset from every edge. Title inset by inner shell The direct child creates the breathing room.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Full-bleed marquee shell","headingFontSize":13,"kickerTag":"div","kickerText":"child padding 0, but it has the same background as the parent, so no child boundary is visible. Same-surface visual shell The text belongs to the parent surface, not to a distinct zero-padding card.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":3,"headingText":"Inner text surface","headingFontSize":13,"kickerTag":"div","kickerText":"marquee shell clips animated cards intentionally; the cards, not the shell, own text padding. Quote card with its own comfortable padding. Another moving card, also padded inside.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":1,"headingText":"Everything your whole team needs to launch quickly and finally rest at night","headingFontSize":80,"kickerTag":"h1","kickerText":"A sweeping product headline that runs on far too long to sit at this size","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":96,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":1,"headingText":"Ship faster","headingFontSize":120,"kickerTag":"h1","kickerText":"Bold.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":168,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":1,"headingText":"A perfectly ordinary headline that is reasonably long but set at a sane, readable size","headingFontSize":40,"kickerTag":"h1","kickerText":"Ship faster","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":120,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"Tracking crushed heading variant text","headingFontSize":16,"kickerTag":"p","kickerText":"Tracking crushed pixels heading line","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":64,"kickerLetterSpacing":-4}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"Detector","headingFontSize":20,"kickerTag":"h1","kickerText":"Changelog","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":34,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"What the rule catches","headingFontSize":20,"kickerTag":"p","kickerText":"gradients stop tripping the contrast rules when the glyph fill is transparent.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"Pulsing dots","headingFontSize":20,"kickerTag":"p","kickerText":"The Tailwind form pairs bg-clip-text with bg-gradient-to-r on one element; the two utilities together are the tell.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":16,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"Side stripes","headingFontSize":20,"kickerTag":"pre","kickerText":".status-dot { width: 8px; height: 8px; border-radius: 50%; animation: pulse 2s ease-in-out infinite; }","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":13,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"Inline gradient heading","headingFontSize":28,"kickerTag":"h1","kickerText":"Ship Faster With Us","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":44,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":2,"headingText":"Tailwind gradient heading","headingFontSize":16,"kickerTag":"h2","kickerText":"Inline gradient heading","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":28,"kickerLetterSpacing":0}],"result":false}
|
|
{"args":[{"headingLevel":1,"headingText":"Should pass","headingFontSize":15,"kickerTag":"section","kickerText":"Flag Pale On Currentcolor Panel: the ground is the panel's own bone text color, so the keyword must resolve rather than abstain.","kickerTextTransform":"none","kickerFontVariant":"normal ","kickerFontSize":15,"kickerLetterSpacing":0}],"result":false}
|