Test results

Pick a model to see how accessible its components are, with the accessibility skill off and on.

Grok 4.7

Skill version 2.3

Totals for the whole run, across 3 generations of each of the 22 components
Measure	Skill off	Skill on
Failed acceptance criteria	90	9
of which WCAG	60	8
of which Best practice	30	1
Total cost (US dollars)	$7.93	$51.79
Input tokens	2.6 million	35.3 million
Output tokens	805,511	3.1 million

Link

Results, totals across all generations

Cost in USD

Failed acceptance criteria

Skill off

1 fail

WCAG: 1 fail
Best practice: 0 fails

Skill on

2 fails

WCAG: 1 fail
Best practice: 1 fail

Total cost

Skill off: $0.27
Skill on: $1.53

Efficiency, average per generation

Input tokens include cache reads.

Input tokens

Skill off: 29,307 tokens
Skill on: 315,610 tokens

Output tokens

Skill off: 8,920 tokens
Skill on: 37,344 tokens

Turns

Skill off: 4 turns
Skill on: 12 turns

Time

Skill off: 110 seconds
Skill on: 510 seconds

Cost

Skill off: $0.09
Skill on: $0.51

Prompt given to the model

Build link components in a single self-contained HTML file (inline CSS and JS, no build step, no external libraries). Include two things on the page: 1. A horizontal site navigation bar with four links: Home, Products, Pricing, and Contact. The current page is Products. 2. A short paragraph (two or three sentences) of marketing copy for a coffee subscription service, with one link inside the paragraph text that goes to the Pricing page. Output the complete code in one HTML code block.

Generated code

Skill off: Generation 1, skill off (opens in a new tab)
Generation 2, skill off (opens in a new tab)
Generation 3, skill off (opens in a new tab)
Skill on: Generation 1, skill on (opens in a new tab)
Generation 2, skill on (opens in a new tab)
Generation 3, skill on (opens in a new tab)

Showing 16 of 16 criteria

Labels and messaging2 criteria

The link informs users where it goes to (its purpose is clear from the link text in context).WCAG 2.4.4Judgement
Skill off
3/3 passed
- Generation 1: Pass
- Generation 2: Pass
- Generation 3: Pass
Skill on
3/3 passed
- Generation 1: Pass
- Generation 2: Pass
- Generation 3: Pass
The link informs users when it is for the current page or step.Best practiceAutomated
Skill off
3/3 passed
- Generation 1: Pass
- Generation 2: Pass
- Generation 3: Pass
Skill on
1/3 failed
- Generation 1: Fail
- Generation 2: Pass
- Generation 3: Pass

Semantic markup5 criteria

The link's role is included in the accessibility tree.WCAG 4.1.2Automated
Skill off
3/3 passed
- Generation 1: Pass
- Generation 2: Pass
- Generation 3: Pass
Skill on
3/3 passed
- Generation 1: Pass
- Generation 2: Pass
- Generation 3: Pass
The link's accessible name is included in the accessibility tree.WCAG 4.1.2Automated
Skill off
3/3 passed
- Generation 1: Pass
- Generation 2: Pass
- Generation 3: Pass
Skill on
3/3 passed
- Generation 1: Pass
- Generation 2: Pass
- Generation 3: Pass
When a link indicates the current page, that current state is included in the accessibility tree.WCAG 4.1.2Automated
Skill off
3/3 passed
- Generation 1: Pass
- Generation 2: Pass
- Generation 3: Pass
Skill on
3/3 passed
- Generation 1: Pass
- Generation 2: Pass
- Generation 3: Pass
The link's accessible name contains the text of its visible label.WCAG 2.5.3Automated
Skill off
3/3 passed
- Generation 1: Pass
- Generation 2: Pass
- Generation 3: Pass
Skill on
3/3 passed
- Generation 1: Pass
- Generation 2: Pass
- Generation 3: Pass
The link's accessible name matches its visible label exactly, or at least starts with the exact text of the visible label.Best practiceAutomated
Skill off
3/3 passed
- Generation 1: Pass
- Generation 2: Pass
- Generation 3: Pass
Skill on
3/3 passed
- Generation 1: Pass
- Generation 2: Pass
- Generation 3: Pass

Keyboard4 criteria

The link is focusable using a keyboard.WCAG 2.1.1Browser
Skill off
3/3 passed
- Generation 1: Pass
- Generation 2: Pass
- Generation 3: Pass
Skill on
3/3 passed
- Generation 1: Pass
- Generation 2: Pass
- Generation 3: Pass
The link is activated by pressing the Enter key on the keyboard.Best practiceBrowser
Skill off
3/3 passed
- Generation 1: Pass
- Generation 2: Pass
- Generation 3: Pass
Skill on
3/3 passed
- Generation 1: Pass
- Generation 2: Pass
- Generation 3: Pass
The link has a focus style when it receives focus using a keyboard.WCAG 2.4.7Browser
Skill off
3/3 passed
- Generation 1: Pass
- Generation 2: Pass
- Generation 3: Pass
Skill on
3/3 passed
- Generation 1: Pass
- Generation 2: Pass
- Generation 3: Pass
The keyboard focus style still renders in forced-colours mode (e.g. Windows High Contrast Mode).Best practiceBrowser
Skill off
3/3 passed
- Generation 1: Pass
- Generation 2: Pass
- Generation 3: Pass
Skill on
3/3 passed
- Generation 1: Pass
- Generation 2: Pass
- Generation 3: Pass

Visual design4 criteria

All text meets the minimum contrast ratio of 4.5:1 against the background colour, or 3:1 for large-scale text.WCAG 1.4.3Automated
Skill off
3/3 passed
- Generation 1: Pass
- Generation 2: Pass
- Generation 3: Pass
Skill on
1/3 failed
- Generation 1: Fail
- Generation 2: Pass
- Generation 3: Pass
The link does not rely on colour alone to indicate it is a link (e.g. it is underlined, bold, or uses an icon).WCAG 1.4.1Automated
Skill off
3/3 passed
- Generation 1: Pass
- Generation 2: Pass
- Generation 3: Pass
Skill on
3/3 passed
- Generation 1: Pass
- Generation 2: Pass
- Generation 3: Pass
The link does not look like plain text.Best practiceAutomated
Skill off
3/3 passed
- Generation 1: Pass
- Generation 2: Pass
- Generation 3: Pass
Skill on
3/3 passed
- Generation 1: Pass
- Generation 2: Pass
- Generation 3: Pass
If the link uses a custom focus style, the focus indicator has a contrast ratio of at least 3:1 against its background colour.WCAG 1.4.11Browser
Skill off
2/3 passed
- Generation 1: Pass
- Generation 2: Not applicable
- Generation 3: Pass
Skill on
3/3 passed
- Generation 1: Pass
- Generation 2: Pass
- Generation 3: Pass

Adaptive UI1 criterion

The links can be viewed at smaller screen widths (320px) without loss of content or functionality, and without requiring horizontal scrolling.WCAG 1.4.10Browser
Skill off
1/3 failed
- Generation 1: Pass
- Generation 2: Fail
- Generation 3: Pass
Skill on
0/3 passed
- Generation 1: Unmeasured
- Generation 2: Unmeasured
- Generation 3: Unmeasured

Notes on this run

Skill on

The primary navigation styling is broken in Generation 1.