Primer is GitHub's design system. This is the CSS implementation
This report summarizes scanner evidence for primer/css, a SCSS project with 13,047 GitHub stars. SynthScan examined 44,502 lines of code across 230 source files, recording 52 pattern matches distributed across 5 syntactic categories. The legacy adjusted pattern signal is 1.5 (Low pattern signal); it is not an authorship estimate.
Use the findings to ask whether maintainers can explain intent, verify dependencies, simplify unnecessary scaffolding, and focus review effort. Risk Payload v1 adds ownership, supply-chain, over-engineering, and review-effort vectors when available. These are prompts for human verification, not probabilities, security findings, or measured maintenance costs.
Use each vector to guide manual verification of the underlying findings.
Payload schema: 1.0.0 · Engine: 2.0.0 · Scoring: heuristic-density-v1 · Scan date: 2026-10-31.
Can maintainers explain intent, assumptions, and trade-offs? 19 finding(s).
Are imports declared and package/API names verified? 33 finding(s).
Are wrappers, guards, and repeated structures necessary? 1 finding(s).
Which changes need focused human review? 52 finding(s).
This chart tracks the legacy adjusted pattern score across scan runs. Changes can reflect source changes, scan coverage, or detector/scoring versions; they do not measure AI adoption or prove that a team refactored code. Compare runs only when their scoring versions are compatible. The dashed line tracks the raw pattern-hit count.
Groups findings by configured severity weight. Severity is not a confidence estimate, security rating, or proof that a package is missing. Verify imports against the project's manifests and inspect each finding in its local design context.
This horizontal bar chart shows where configured pattern scores accumulate across directories. Treat the bars as locations to inspect, not as evidence of authorship or code quality. Use the file-level findings to decide whether a directory needs a focused ownership, dependency, complexity, or review check.
The scanner identified 52 distinct pattern matches across 5 syntactic categories. Each entry below represents a discrete location in the source code where the engine recorded a detector match to inspect in context. Expand any category row to inspect the individual file paths, line numbers, code snippets, and the lexical context (CODE, COMMENT, or STRING) in which each match was detected.
Reading the findings table: The Severity column indicates the configured finding weight (CRITICAL / HIGH / MEDIUM / LOW). The Context column identifies whether the match occurred inside executable code, an inline comment, or a string literal — legacy comment-context matches receive a ×1.5 score weight. The ⚡ bolt icon marks clustered matches: three or more patterns within a 10-line window, each receiving an additional ×1.5 density multiplier under the legacy scoring model.
| Severity | File | Line | Snippet | Context |
|---|---|---|---|---|
| LOW | …es/deprecated-components/Markdown/Markdown.stories.tsx | 36 | This is a normal paragraph following a header. Bacon ipsum dolor sit amet t-bone doner shank drumstick, pork | CODE |
| LOW | …es/deprecated-components/Markdown/Markdown.stories.tsx | 42 | This is a blockquote following a header. Bacon ipsum dolor sit amet t-bone doner shank drumstick, pork belly | CODE |
| LOW⚡ | docs/stories/utilities/Layout.stories.jsx | 200 | <p>Until recently, the prevailing view assumed lorem ipsum was born as a nonsense text. “It's not Latin, though | CODE |
| LOW⚡ | docs/stories/utilities/Layout.stories.jsx | 209 | <p>The placeholder text, beginning with the line “Lorem ipsum dolor sit amet, consectetur adipiscing elit”, look | CODE |
| LOW⚡ | docs/stories/utilities/Layout.stories.jsx | 209 | <p>The placeholder text, beginning with the line “Lorem ipsum dolor sit amet, consectetur adipiscing elit”, look | CODE |
| LOW⚡ | docs/stories/utilities/Layout.stories.jsx | 216 | <p>Richard McClintock, a Latin scholar from Hampden-Sydney College, is credited with discovering the source behi | CODE |
| LOW | docs/stories/utilities/Layout.stories.jsx | 227 | <p>Until recently, the prevailing view assumed lorem ipsum was born as a nonsense text. “It's not Latin, though | CODE |
| LOW | docs/stories/utilities/Layout.stories.jsx | 235 | <p>Richard McClintock, a Latin scholar from Hampden-Sydney College, is credited with discovering the source behi | CODE |
| LOW | docs/stories/utilities/Flexbox.stories.jsx | 397 | <p class="pl-4 m-0"><b>Body</b> Bacon ipsum dolor sit amet chuck prosciutto landjaeger ham hock filet mignon shoulde | CODE |
| LOW | docs/stories/utilities/Flexbox.stories.jsx | 407 | <p><b>Body</b> Bacon ipsum dolor sit amet chuck prosciutto landjaeger ham hock filet mignon shoulder hamburger pig | CODE |
| LOW⚡ | docs/stories/utilities/MarketingTypography.stories.jsx | 20 | Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean ultricies ante sit amet neque facilisis feugiat. | CODE |
| LOW⚡ | docs/stories/utilities/MarketingTypography.stories.jsx | 20 | Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean ultricies ante sit amet neque facilisis feugiat. | CODE |
| LOW⚡ | docs/stories/utilities/MarketingTypography.stories.jsx | 26 | Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean ultricies ante sit amet neque facilisis feugiat. | CODE |
| LOW⚡ | docs/stories/utilities/MarketingTypography.stories.jsx | 26 | Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean ultricies ante sit amet neque facilisis feugiat. | CODE |
| LOW⚡ | docs/stories/utilities/MarketingTypography.stories.jsx | 32 | Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean ultricies ante sit amet neque facilisis feugiat. | CODE |
| LOW⚡ | docs/stories/utilities/MarketingTypography.stories.jsx | 32 | Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean ultricies ante sit amet neque facilisis feugiat. | CODE |
| LOW⚡ | docs/stories/utilities/MarketingTypography.stories.jsx | 38 | Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean ultricies ante sit amet neque facilisis feugiat. | CODE |
| LOW⚡ | docs/stories/utilities/MarketingTypography.stories.jsx | 38 | Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean ultricies ante sit amet neque facilisis feugiat. | CODE |
| LOW⚡ | docs/stories/utilities/MarketingTypography.stories.jsx | 44 | Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean ultricies ante sit amet neque facilisis feugiat. | CODE |
| LOW⚡ | docs/stories/utilities/MarketingTypography.stories.jsx | 44 | Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean ultricies ante sit amet neque facilisis feugiat. | CODE |
| LOW⚡ | docs/stories/utilities/MarketingTypography.stories.jsx | 50 | Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean ultricies ante sit amet neque facilisis feugiat. | CODE |
| LOW⚡ | docs/stories/utilities/MarketingTypography.stories.jsx | 50 | Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean ultricies ante sit amet neque facilisis feugiat. | CODE |
| LOW⚡ | docs/stories/utilities/MarketingTypography.stories.jsx | 56 | Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean ultricies ante sit amet neque facilisis feugiat. | CODE |
| LOW⚡ | docs/stories/utilities/MarketingTypography.stories.jsx | 56 | Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean ultricies ante sit amet neque facilisis feugiat. | CODE |
| LOW⚡ | …cs/stories/components/Layout/StackFeatures.stories.jsx | 116 | Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum id faucibus sapien. Nullam gravida tortor | CODE |
| LOW⚡ | …cs/stories/components/Layout/StackFeatures.stories.jsx | 116 | Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum id faucibus sapien. Nullam gravida tortor | CODE |
| LOW⚡ | …cs/stories/components/Layout/StackFeatures.stories.jsx | 121 | Ut eu ligula tellus. Integer efficitur sit amet lorem nec hendrerit. In hac habitasse platea dictumst. Donec a | CODE |
| LOW⚡ | …cs/stories/components/Layout/StackFeatures.stories.jsx | 126 | Ut cursus elit leo. Curabitur in lorem eget sem ullamcorper tempor. Lorem ipsum dolor sit amet, consectetur ad | CODE |
| LOW⚡ | …cs/stories/components/Layout/StackFeatures.stories.jsx | 126 | Ut cursus elit leo. Curabitur in lorem eget sem ullamcorper tempor. Lorem ipsum dolor sit amet, consectetur ad | CODE |
| LOW | …cs/stories/components/Layout/StackExamples.stories.jsx | 47 | <div>Lorem ipsum dolor sit amet avec consequer domulus sit lorem ipsum dolor sit amet.</div> | CODE |
| LOW | …cs/stories/components/Layout/StackExamples.stories.jsx | 47 | <div>Lorem ipsum dolor sit amet avec consequer domulus sit lorem ipsum dolor sit amet.</div> | CODE |
| LOW | …cs/stories/components/Layout/StackExamples.stories.jsx | 63 | <div>Lorem ipsum dolor sit amet avec consequer domulus sit lorem ipsum dolor sit amet.</div> | CODE |
| LOW | …cs/stories/components/Layout/StackExamples.stories.jsx | 63 | <div>Lorem ipsum dolor sit amet avec consequer domulus sit lorem ipsum dolor sit amet.</div> | CODE |
| Severity | File | Line | Snippet | Context |
|---|---|---|---|---|
| LOW | .github/workflows/issue-triage.lock.yml | 1 | # gh-aw-metadata: {"schema_version":"v4","frontmatter_hash":"d23bcf162bac601dabe61e6a2bd50d12ae8fe1b02a70ba0700827249437 | COMMENT |
| LOW | .github/workflows/issue-triage.lock.yml | 21 | # gh aw compile | COMMENT |
| LOW | .github/workflows/issue-triage.lock.yml | 41 | # - actions/cache/restore@55cc8345863c7cc4c66a329aec7e433d2d1c52a9 # v6.1.0 | COMMENT |
| LOW | .github/workflows/codeql.yml | 1 | # For most projects, this workflow file will not need changing; you simply need | COMMENT |
| LOW | .github/workflows/codeql.yml | 61 | # ✏️ If the Autobuild fails above, remove it and uncomment the following three lines | COMMENT |
| LOW | .github/workflows/agentics-maintenance.yml | 1 | # This file was automatically generated by pkg/workflow/maintenance_workflow.go (v0.83.1). DO NOT EDIT. To debug this wo | COMMENT |
| LOW | .github/workflows/agentics-maintenance.yml | 21 | # | COMMENT |
| LOW | src/forms/form-group.scss | 1 | // stylelint-disable selector-max-type | COMMENT |
| LOW | src/markdown/lists.scss | 41 | } | COMMENT |
| LOW | src/layout/app-frame.scss | 1 | // stylelint-disable max-nesting-depth | COMMENT |
| LOW | src/layout/stack.scss | 1 | // Stack layout helper component | COMMENT |
| LOW | src/utilities/typography.scss | 1 | // stylelint-disable primer/typography | COMMENT |
| LOW | src/support/mixins/color-modes.scss | 1 | // This mixin is used to output the tokens/variables from Primitives | COMMENT |
| LOW | src/support/mixins/color-modes.scss | 101 | // | COMMENT |
| LOW | src/support/mixins/color-modes.scss | 141 | COMMENT | |
| LOW | src/marketing/utilities/borders.scss | 1 | // Marketing border utilities | COMMENT |
| Severity | File | Line | Snippet | Context |
|---|---|---|---|---|
| MEDIUM | .github/workflows/agentics-maintenance.yml | 24 | # This file defines the generated agentic maintenance workflow for this repository. | COMMENT |
| Severity | File | Line | Snippet | Context |
|---|---|---|---|---|
| MEDIUM | .github/workflows/agentics-maintenance.yml | 24 | # This file defines the generated agentic maintenance workflow for this repository. | COMMENT |
| Severity | File | Line | Snippet | Context |
|---|---|---|---|---|
| LOW | __tests__/utils/css.js | 54 | export function currentVersionDeprecations() { | CODE |