Pill CTA button built to an exact box and token sheet
One task across 30 published runs. Inspect the scores and outputs together, with each run's execution method shown.
- Task
- PIXEL-0005
- Domain
- UI components
- Difficulty
- hard
Leading published run: claude-opus-4-8 (low reasoning) at 100.0% composite. Lowest: claude-haiku-4-5 at 0.0%. 30 published runs shown on this task.
How this task was evaluated
Results are ordered by this task's published score. API runs use one prompt and one completion; agent runs use a coding harness with tools and iteration. Inspect the execution method when comparing results.
Objective scores use the benchmark's execution checks. Judge scores use a vision panel's fixed rubric; the published score leaves out a model's own family. Missing values are labelled rather than treated as zero.
Read the brief
Build a single self-contained HTML file (`index.html`) that renders one call-to-action button, with no build step and no network calls (inline all CSS, no external fonts or scripts). The grader measures the rendered button box and computed style, so match the spec exactly. Button `<button id="cta">`: - width: 220px - height: 52px - border-radius: 26px (a full pill at this height) - font-size: 17px, font-weight 600 - background colour: #16a34a - text colour: #ffffff - text: Get started free The 220 by 52 box, the 26px radius, the 17px font-size, and the #16a34a fill are the contract. A visually similar green pill that is off by a few px or a few hex points fails.