{ "wide": [ { "approvedRole": "audit source-path label", "finding": { "rule": "color-contrast", "target": [ "section[data-audit-item=\"typography\"] > header > .design-audit-source" ], "html": "packages/visuals/theme.css", "evidence": "Fix any of the following:\n Element has insufficient color contrast of 4.12 (foreground color: #78766e, background color: #f4f4f1, font size: 10.5pt (14.0351px), font weight: normal). Expected contrast ratio of 4.5:1" } }, { "approvedRole": "audit type-scale metadata", "finding": { "rule": "color-contrast", "target": [ "div:nth-child(1) > .design-audit-type-label > span" ], "html": "Small metadata", "evidence": "Fix any of the following:\n Element has insufficient color contrast of 4.12 (foreground color: #78766e, background color: #f4f4f1, font size: 10.5pt (14.0351px), font weight: normal). Expected contrast ratio of 4.5:1" } }, { "approvedRole": "audit type-scale metadata", "finding": { "rule": "color-contrast", "target": [ "div:nth-child(1) > .design-audit-type-label > code" ], "html": "11.3–11.5px · step −2.5", "evidence": "Fix any of the following:\n Element has insufficient color contrast of 4.12 (foreground color: #78766e, background color: #f4f4f1, font size: 10.5pt (14.0351px), font weight: normal). Expected contrast ratio of 4.5:1" } }, { "approvedRole": "audit type-scale metadata", "finding": { "rule": "color-contrast", "target": [ "div:nth-child(2) > .design-audit-type-label > span" ], "html": "Compact controls", "evidence": "Fix any of the following:\n Element has insufficient color contrast of 4.12 (foreground color: #78766e, background color: #f4f4f1, font size: 10.5pt (14.0351px), font weight: normal). Expected contrast ratio of 4.5:1" } }, { "approvedRole": "audit type-scale metadata", "finding": { "rule": "color-contrast", "target": [ "div:nth-child(2) > .design-audit-type-label > code" ], "html": "12–12.3px · step −2", "evidence": "Fix any of the following:\n Element has insufficient color contrast of 4.12 (foreground color: #78766e, background color: #f4f4f1, font size: 10.5pt (14.0351px), font weight: normal). Expected contrast ratio of 4.5:1" } }, { "approvedRole": "audit type-scale metadata", "finding": { "rule": "color-contrast", "target": [ "div:nth-child(3) > .design-audit-type-label > span" ], "html": "Interface and chat", "evidence": "Fix any of the following:\n Element has insufficient color contrast of 4.12 (foreground color: #78766e, background color: #f4f4f1, font size: 10.5pt (14.0351px), font weight: normal). Expected contrast ratio of 4.5:1" } }, { "approvedRole": "audit type-scale metadata", "finding": { "rule": "color-contrast", "target": [ "div:nth-child(3) > .design-audit-type-label > code" ], "html": "13.4–14px · step −1", "evidence": "Fix any of the following:\n Element has insufficient color contrast of 4.12 (foreground color: #78766e, background color: #f4f4f1, font size: 10.5pt (14.0351px), font weight: normal). Expected contrast ratio of 4.5:1" } }, { "approvedRole": "audit type-scale metadata", "finding": { "rule": "color-contrast", "target": [ "div:nth-child(4) > .design-audit-type-label > span" ], "html": "Document prose", "evidence": "Fix any of the following:\n Element has insufficient color contrast of 4.12 (foreground color: #78766e, background color: #f4f4f1, font size: 10.5pt (14.0351px), font weight: normal). Expected contrast ratio of 4.5:1" } }, { "approvedRole": "audit type-scale metadata", "finding": { "rule": "color-contrast", "target": [ "div:nth-child(4) > .design-audit-type-label > code" ], "html": "15–16px · step 0", "evidence": "Fix any of the following:\n Element has insufficient color contrast of 4.12 (foreground color: #78766e, background color: #f4f4f1, font size: 10.5pt (14.0351px), font weight: normal). Expected contrast ratio of 4.5:1" } }, { "approvedRole": "audit type-scale metadata", "finding": { "rule": "color-contrast", "target": [ "div:nth-child(5) > .design-audit-type-label > span" ], "html": "Subheading", "evidence": "Fix any of the following:\n Element has insufficient color contrast of 4.12 (foreground color: #78766e, background color: #f4f4f1, font size: 10.5pt (14.0351px), font weight: normal). Expected contrast ratio of 4.5:1" } }, { "approvedRole": "audit type-scale metadata", "finding": { "rule": "color-contrast", "target": [ "div:nth-child(5) > .design-audit-type-label > code" ], "html": "18.8–20.8px · step +2", "evidence": "Fix any of the following:\n Element has insufficient color contrast of 4.12 (foreground color: #78766e, background color: #f4f4f1, font size: 10.5pt (14.0351px), font weight: normal). Expected contrast ratio of 4.5:1" } }, { "approvedRole": "audit type-scale metadata", "finding": { "rule": "color-contrast", "target": [ "div:nth-child(6) > .design-audit-type-label > span" ], "html": "Section heading", "evidence": "Fix any of the following:\n Element has insufficient color contrast of 4.12 (foreground color: #78766e, background color: #f4f4f1, font size: 10.5pt (14.0351px), font weight: normal). Expected contrast ratio of 4.5:1" } }, { "approvedRole": "audit type-scale metadata", "finding": { "rule": "color-contrast", "target": [ "div:nth-child(6) > .design-audit-type-label > code" ], "html": "21.1–23.7px · step +3", "evidence": "Fix any of the following:\n Element has insufficient color contrast of 4.12 (foreground color: #78766e, background color: #f4f4f1, font size: 10.5pt (14.0351px), font weight: normal). Expected contrast ratio of 4.5:1" } }, { "approvedRole": "audit type-scale metadata", "finding": { "rule": "color-contrast", "target": [ "div:nth-child(7) > .design-audit-type-label > span" ], "html": "Document title", "evidence": "Fix any of the following:\n Element has insufficient color contrast of 4.12 (foreground color: #78766e, background color: #f4f4f1, font size: 10.5pt (14.0351px), font weight: normal). Expected contrast ratio of 4.5:1" } }, { "approvedRole": "audit type-scale metadata", "finding": { "rule": "color-contrast", "target": [ "div:nth-child(7) > .design-audit-type-label > code" ], "html": "26.4–30.8px · step +5", "evidence": "Fix any of the following:\n Element has insufficient color contrast of 4.12 (foreground color: #78766e, background color: #f4f4f1, font size: 10.5pt (14.0351px), font weight: normal). Expected contrast ratio of 4.5:1" } } ], "narrow": [ { "approvedRole": "audit source-path label", "finding": { "rule": "color-contrast", "target": [ "section[data-audit-item=\"typography\"] > header > .design-audit-source" ], "html": "packages/visuals/theme.css", "evidence": "Fix any of the following:\n Element has insufficient color contrast of 4.12 (foreground color: #78766e, background color: #f4f4f1, font size: 10.1pt (13.4107px), font weight: normal). Expected contrast ratio of 4.5:1" } }, { "approvedRole": "audit type-scale metadata", "finding": { "rule": "color-contrast", "target": [ "div:nth-child(1) > .design-audit-type-label > span" ], "html": "Small metadata", "evidence": "Fix any of the following:\n Element has insufficient color contrast of 4.12 (foreground color: #78766e, background color: #f4f4f1, font size: 10.1pt (13.4107px), font weight: normal). Expected contrast ratio of 4.5:1" } }, { "approvedRole": "audit type-scale metadata", "finding": { "rule": "color-contrast", "target": [ "div:nth-child(1) > .design-audit-type-label > code" ], "html": "11.3–11.5px · step −2.5", "evidence": "Fix any of the following:\n Element has insufficient color contrast of 4.12 (foreground color: #78766e, background color: #f4f4f1, font size: 10.1pt (13.4107px), font weight: normal). Expected contrast ratio of 4.5:1" } }, { "approvedRole": "audit type-scale metadata", "finding": { "rule": "color-contrast", "target": [ "div:nth-child(2) > .design-audit-type-label > span" ], "html": "Compact controls", "evidence": "Fix any of the following:\n Element has insufficient color contrast of 4.12 (foreground color: #78766e, background color: #f4f4f1, font size: 10.1pt (13.4107px), font weight: normal). Expected contrast ratio of 4.5:1" } }, { "approvedRole": "audit type-scale metadata", "finding": { "rule": "color-contrast", "target": [ "div:nth-child(2) > .design-audit-type-label > code" ], "html": "12–12.3px · step −2", "evidence": "Fix any of the following:\n Element has insufficient color contrast of 4.12 (foreground color: #78766e, background color: #f4f4f1, font size: 10.1pt (13.4107px), font weight: normal). Expected contrast ratio of 4.5:1" } }, { "approvedRole": "audit type-scale metadata", "finding": { "rule": "color-contrast", "target": [ "div:nth-child(3) > .design-audit-type-label > span" ], "html": "Interface and chat", "evidence": "Fix any of the following:\n Element has insufficient color contrast of 4.12 (foreground color: #78766e, background color: #f4f4f1, font size: 10.1pt (13.4107px), font weight: normal). Expected contrast ratio of 4.5:1" } }, { "approvedRole": "audit type-scale metadata", "finding": { "rule": "color-contrast", "target": [ "div:nth-child(3) > .design-audit-type-label > code" ], "html": "13.4–14px · step −1", "evidence": "Fix any of the following:\n Element has insufficient color contrast of 4.12 (foreground color: #78766e, background color: #f4f4f1, font size: 10.1pt (13.4107px), font weight: normal). Expected contrast ratio of 4.5:1" } }, { "approvedRole": "audit type-scale metadata", "finding": { "rule": "color-contrast", "target": [ "div:nth-child(4) > .design-audit-type-label > span" ], "html": "Document prose", "evidence": "Fix any of the following:\n Element has insufficient color contrast of 4.12 (foreground color: #78766e, background color: #f4f4f1, font size: 10.1pt (13.4107px), font weight: normal). Expected contrast ratio of 4.5:1" } }, { "approvedRole": "audit type-scale metadata", "finding": { "rule": "color-contrast", "target": [ "div:nth-child(4) > .design-audit-type-label > code" ], "html": "15–16px · step 0", "evidence": "Fix any of the following:\n Element has insufficient color contrast of 4.12 (foreground color: #78766e, background color: #f4f4f1, font size: 10.1pt (13.4107px), font weight: normal). Expected contrast ratio of 4.5:1" } }, { "approvedRole": "audit type-scale metadata", "finding": { "rule": "color-contrast", "target": [ "div:nth-child(5) > .design-audit-type-label > span" ], "html": "Subheading", "evidence": "Fix any of the following:\n Element has insufficient color contrast of 4.12 (foreground color: #78766e, background color: #f4f4f1, font size: 10.1pt (13.4107px), font weight: normal). Expected contrast ratio of 4.5:1" } }, { "approvedRole": "audit type-scale metadata", "finding": { "rule": "color-contrast", "target": [ "div:nth-child(5) > .design-audit-type-label > code" ], "html": "18.8–20.8px · step +2", "evidence": "Fix any of the following:\n Element has insufficient color contrast of 4.12 (foreground color: #78766e, background color: #f4f4f1, font size: 10.1pt (13.4107px), font weight: normal). Expected contrast ratio of 4.5:1" } }, { "approvedRole": "audit type-scale metadata", "finding": { "rule": "color-contrast", "target": [ "div:nth-child(6) > .design-audit-type-label > span" ], "html": "Section heading", "evidence": "Fix any of the following:\n Element has insufficient color contrast of 4.12 (foreground color: #78766e, background color: #f4f4f1, font size: 10.1pt (13.4107px), font weight: normal). Expected contrast ratio of 4.5:1" } }, { "approvedRole": "audit type-scale metadata", "finding": { "rule": "color-contrast", "target": [ "div:nth-child(6) > .design-audit-type-label > code" ], "html": "21.1–23.7px · step +3", "evidence": "Fix any of the following:\n Element has insufficient color contrast of 4.12 (foreground color: #78766e, background color: #f4f4f1, font size: 10.1pt (13.4107px), font weight: normal). Expected contrast ratio of 4.5:1" } }, { "approvedRole": "audit type-scale metadata", "finding": { "rule": "color-contrast", "target": [ "div:nth-child(7) > .design-audit-type-label > span" ], "html": "Document title", "evidence": "Fix any of the following:\n Element has insufficient color contrast of 4.12 (foreground color: #78766e, background color: #f4f4f1, font size: 10.1pt (13.4107px), font weight: normal). Expected contrast ratio of 4.5:1" } }, { "approvedRole": "audit type-scale metadata", "finding": { "rule": "color-contrast", "target": [ "div:nth-child(7) > .design-audit-type-label > code" ], "html": "26.4–30.8px · step +5", "evidence": "Fix any of the following:\n Element has insufficient color contrast of 4.12 (foreground color: #78766e, background color: #f4f4f1, font size: 10.1pt (13.4107px), font weight: normal). Expected contrast ratio of 4.5:1" } } ] }