Playground · Business · HTML · Standing test
A category page from a product feed
A shop category page is ordinary work, which is what makes it a good test: twelve rain jackets from a small product feed, with filters for brand, colour, size and price and sorting by price and rating. Nothing here is hard to draw. What matters is accuracy. Every price and rating has to match the feed, every filter has to return exactly the right jackets, and the page should not invent selling points the feed never mentions. We ran each page with scripts: filtering by Ridgeback, navy and XS, setting a price limit, sorting both ways, and reading the products shown after each step.
The prompt, word for word
Here are the products in an online shop's "Rain jackets" category, from its product feed (CSV): id,title,brand,price_gbp,colour,sizes,rating,reviews RJ-01,Packable rain shell,Northline,49.00,navy,S|M|L|XL,4.4,212 RJ-02,Packable rain shell,Northline,49.00,yellow,S|M|L,4.4,212 RJ-03,Storm parka,Fellwater,189.00,black,M|L|XL,4.7,96 RJ-04,Storm parka,Fellwater,189.00,olive,S|M|L,4.7,96 RJ-05,City trench,Arden & Vale,145.00,stone,XS|S|M|L,4.2,58 RJ-06,Lightweight anorak,Northline,65.00,red,S|M|L|XL,3.9,141 RJ-07,Trail jacket 2.5L,Ridgeback,119.00,blue,S|M|L|XL|XXL,4.5,330 RJ-08,Trail jacket 2.5L,Ridgeback,119.00,black,S|M|L|XL|XXL,4.5,330 RJ-09,Kids' puddle jacket,Little Fell,32.00,pink,3-4Y|5-6Y|7-8Y,4.8,74 RJ-10,Kids' puddle jacket,Little Fell,32.00,green,3-4Y|5-6Y|7-8Y,4.8,74 RJ-11,Insulated rain coat,Fellwater,159.00,navy,S|M|L,4.1,39 RJ-12,Cycling rain cape,Ridgeback,55.00,orange,One size,3.6,22 Build the category page for these 12 products: a product grid, filters for brand, colour, size and price, and sorting by price and by rating. Filters and sorting must work. Show every product with its correct price and rating; draw simple product images yourself with inline SVG or CSS. Make it a single self-contained HTML file (inline CSS and JavaScript, no external libraries, fonts or images).
Every answer runs live, in a sandboxed frame. Click into one to play with it.
How each model did
| Model | Our notes | Checks | Time | Output tokens | Cost |
|---|---|---|---|---|---|
| GPT-6.1 Sol | A quiet "Field & Form" shop with a serif heading, checkbox filters, min and max price boxes and large drawn jackets in cards. Every filter and both sorts returned exactly the right jackets in our tests, and it adds only a tagline, no product claims. The cards are big, so at desktop width you see two or three jackets at a time. | 4 of 4 | 95 s | 6,820 247 thinking |
$0.069 |
| Claude Opus 5.5 Our pick | A clean four-column grid with a different drawing for each garment: a belted trench, a pouch-front anorak, a quilted coat and a flared cape. It offers checkbox filters with counts, min and max price boxes plus quick bands ("Under £50" correctly shows the four jackets at £32 and £49), and "Also in yellow" links between colours. Every filter and sort we ran was correct, and it adds nothing that is not in the feed. | 4 of 4 | 151 s | 17,916 3,902 thinking |
$0.361 |
| Claude Fable 5.1 | "WetWeather.co": a tidy three-column grid with checkbox filters, colour counts and a price slider paired with number boxes. All the filters and sorts gave the right jackets. It does add "Bestseller" badges to the Ridgeback trail jackets, a sales claim the feed does not make. It was also the most expensive answer by far.
|
3.5 of 4 | 172 s | 16,185 3,928 thinking |
$0.816 |
| Gemini 3.8 Flash | "Aerostorm" has colour swatches, size chips, a single max-price slider and an "Add" button on every card. The filters and sorts all worked. But it stamps "20K WATERPROOF" on six jackets, the city trench among them, adds a free-delivery banner, and draws every jacket with the same short-sleeved shape.
|
3 of 4 | 74 s | 14,167 1,892 thinking |
$0.054 |
| Muse Spark 1.3 | A plain shop with counted checkboxes, including four price bands that each return the right jackets, and each product's feed ID printed under its card. Every filter and sort was correct. It adds "Free delivery over £75 • 60-day returns" to the header, and the jackets look more like short-sleeved shirts.
|
3 of 4 | 197 s | 10,393 4,067 thinking |
$0.045 |
| Grok 4.7 | Grok sent no code on its first three tries, and the fourth failed with an API error. The fifth try produced a "Bracken Outfitters" page, but its script stops with an error as it loads. The filter headings are empty, no jackets appear, and it still says "Showing 12 of 12".Took 5 tries: sent no code at 64,000 tokens; sent no code at 64,000 tokens; sent no code at 128,000 tokens; failed at 128,000 tokens, thinking off; finished at 64,000 tokens.
|
0 of 4 | 284 s | 26,555 15,485 thinking |
$0.160 $0.172 all tries |
| Kimi K3 | A neat three-column grid where brand, colour, size and both sorts all work correctly. The price filter is broken: every band shows a count of 0, and ticking any of them, even "£150 and over", empties the page to "Showing 0 of 12". A footer calls the products, prices and ratings "illustrative".
|
3.5 of 4 | 484 s | 30,461 22,509 thinking |
$0.457 |
| Qwen3.8 Max (0902) | The most styled page: "Downpour Supply Co." with a scrolling ticker, a big yellow-jacket hero, chip filters, price bands and a slider. Every filter and sort we tried worked. It surrounds the products with invented claims, though: a "10K MM / seam sealed" stamp, a "60-day storm test", "Back in stock" news for the Ridgeback jacket and a made-up weather widget. It took over 18 minutes.
|
3 of 4 | 1095 s | 40,797 23,923 thinking |
$0.246 |
| DeepSeek V4.1 Flash | "Rainroom": a plain, well-spaced three-column grid with a two-handled price slider, checkbox filters and rain streaks behind each jacket. Every filter and sort was exact, and it adds nothing beyond the feed. It cost about a penny, the cheapest answer here by a wide margin. | 4 of 4 | 117 s | 23,415 15,545 thinking |
$0.013 |
| Mistral Large 4 | An editorial "Stormline Supply" page with a large jacket hero, swatches, size chips with counts, a price slider and a basket. The filters and sorts all worked correctly. But it invents product facts: a "WATERPROOF 10,000 mm" badge, "taped seams and breathable membranes", and "New" and "Packable" tags, plus delivery terms and "Designed in Glasgow". Its first try was cut off at 64,000 tokens, and the second took 17 minutes.Took 2 tries: ran out of room at 64,000 tokens; finished at 128,000 tokens.
|
3 of 4 | 1029 s | 76,327 45,856 thinking |
$0.160 $0.294 all tries |
One answer per model, at each model's default settings unless the card says otherwise, through OpenRouter. If an answer ran out of room or stopped short, we asked again with more room, then with thinking off, and say so. We tried every answer, with Claude Opus 5.5 running the checks and drafting the notes; it is an Anthropic model, so we check its calls on Claude answers ourselves. This is a quick look, not a benchmark: run it again and every answer will differ. For measured results, see our benchmarks.
What we checked, by trying each answer ourselves: Shows all 12 products with the right prices and ratings; Brand, colour, size and price filters work; Sorting by price and by rating is correct; Adds no products, prices or claims that are not in the feed. A partial pass counts as half.
Verdict
Most models got the hard part right. Eight of the ten pages show all twelve jackets with the right prices and ratings, and almost every filter and sort did what it should. The differences are in restraint and finish. Claude Opus 5.5 is the best page: every check passes, it has the fullest price filtering (min and max boxes plus bands), and it is the only one that draws a trench, an anorak and a cape as different garments (151 s, $0.36). DeepSeek V4.1 Flash and GPT-6.1 Sol also pass everything; DeepSeek did it for $0.013 in 117 s, which makes it the clear value pick.
Gemini, Qwen and Mistral built working pages but added waterproof ratings and other specs that the feed never gives, which a real shop could not publish. Kimi K3's price filter matches nothing at all. Grok 4.7 only produced code on its fifth try, and that page crashes on load and shows no products.
What would your prompt get?The Spring Prompt playground runs one prompt on up to six models from OpenAI, Anthropic, Google, Mistral and others, side by side.
Ask for access
More from the playground
