LLM-Designs

Server

bun _server_/server.ts

Serves the preview dashboard on http://localhost:3000 (override with PORT), the generation harness on http://localhost:3000/generate, the ranking page on http://localhost:3000/ranking and the standings on http://localhost:3000/standings — the nav bar switches between all four and also toggles dark/light mode.

The dashboard rescans the repo for *.html design files on every page load, renders a scaled live-iframe preview per file grouped by project, and opens the design in a separate tab on click. The harness runs the prompts below through the providers configured in _server_/config.json; its results render as a preview grid in the same layout.

The ranking page runs blind 1v1 votes: two models' designs of the same prompt sit side by side on the left (interactive, like the dashboard previews) while the compact vote form lives in a slim sticky sidebar on the right, so both designs and every category stay on screen while you judge. The designs stay anonymous while voting — model names only appear on the standings page. Every comparison shows all categories — Overall, color, functionality, layout, spacing, visual consistency, visual appeal, code quality and usability — one A/Tie/B pick per row with a one-line description of what the category means (Overall is required, the rest are optional). Submit vote records the scores and jumps straight to the next pair. Each side has a Preview/Code tab pair: the code view opens a file browser for multi-file deliveries and shows syntax-highlighted source in a scrollable pane — shiki runs on the server and ships the rendered HTML, so the browser needs no highlighter. Votes land in _server_/votes.json (committed) as { prompt, a, b, scores, at } with scores mapping category keys to "a", "b" or "tie" (older single-winner entries still load). Pairs are chosen so every design gets the same number of voting chances: candidates sort by how often their two designs have been shown, least-seen first, with random tie-breaks; Skip avoids the current pair.

The standings page holds the records: a category tab strip (each tab carries the category's description) switches the table, which ranks each prompt's models by wins − losses (ties listed) and marks the current best and worst design. Every row shows a tiny live preview of the design and a button to open it full size.

File delivery is incremental: write streams the model's output straight to a staged file as it generates, and edit continues or patches files already written (omit find to append, provide find to replace). When a response is cut off by the provider's output-token limit, the harness automatically sends a follow-up turn carrying the interrupted file's tail, so the model resumes where it stopped instead of starting over. A read tool lets it inspect files it has already written in the same run (e.g. to anchor an edit). Projects that ship a bun server (like the multiplayer webgame) get a start/stop control on their dashboard card — the dashboard spawns the server on a free local port (PORT env) and previews it through that.

Providers

The harness loads its endpoints from _server_/config.json. The file is git-ignored because it holds API keys, so create it next to the server:

{
  "providers": [
    {
      "name": "opencode",
      "baseUrl": "https://opencode.ai/zen/go/v1",
      "apiKey": "sk-…",
      "concurrency": 3
    },
    {
      "name": "local",
      "baseUrl": "http://localhost:1234/v1",
      "concurrency": 1
    }
  ]
}

• name — short provider id shown in the select on the generate page; must be unique and must not contain / (model selections are keyed <name>/<model>)
• baseUrl — OpenAI-compatible endpoint root; a trailing / is optional
• apiKey — optional; sent as a Bearer token (omit for keyless local servers)
• concurrency — parallel jobs against this provider (defaults to HARNESS_CONCURRENCY, or 3); each provider runs behind its own limit

Pick the provider in the select on the generate page to list its models; one run can mix model selections across providers. Without config.json the server refuses to start.

On the generate page, prompts that a selected model has already generated are marked with a green chip and skipped — the run button counts only the pairs that would actually run. Tick generate again on a prompt to rerun it for the models that already delivered it.

Prompts

Marketing website

build a modern marketing website for a cms using only html and tailwindcss from a cdn. no javasacript. tailwind cdn url: https://cdn.jsdelivr.net/npm/@tailwindcss/browser@4

Vanilla Marketing website

build a modern marketing website for a cms using only html and vanilla css in a single html file. no javasacript. define variables for the colors, spacing, etc. in css.

Translation manager

build a modern ui for managing translations, it should be intuitive and should allow for quick and easy editing. use tailwindcss from a cdn: https://cdn.jsdelivr.net/npm/@tailwindcss/browser@4

DnD-Manager

build a immersive design for a dnd manager app in a single html file. the app should allow the dm and players to manage characters, campaigns, sessions (with scheduling help), scenes, combat (with initiative), built in dice, location management with map images and a grid. use tailwindcss from the cdn: https://cdn.jsdelivr.net/npm/@tailwindcss/browser@4

Comic-Reader

Design an immersive comic reader application in a single html file. it should support left->right and right->left reading and webtoons (infinite scroll). it should have the ability to make notes on specific locations on a page, add hover areas to characters to show a quick summary, if the reader doesn't remember the character or their traits. it should be able to manage comic metadata (title, description, alternative titles, tags, rating, etc.). it should have a reading history, and when continuing to read a comic, it should continue where the user has stopped last time. use only html, vanilla css with variables for the colors and spacing, and vanilla javascript in a single html file.

Finance manager

Design a finance management application in a single html file. it should be for individuals or families managing their bank accounts, assets (like stocks or funds, where the value keeps changing), subscriptions (with varying interval lengths and payment periods), and transactions across all those accounts. it should allow the users to see their spending and income visualized over any selected period, with graphs, etc. use vanilla css with variables for the colors and spacing, normal html, and vanilla javascript, all in a single html file. you can load fonts from google or bunny fonts.

Card game with webgl

build a card game using webgl in a single self contained html file. use only vanilla javascript, vanilla css, vanilla html.

Multiplayer webgame

build a multiplayer 2D top-down shooter game using a single html file with vanilla html, css, javascript. build the server as a bun server (you are encouraged to section the backend code into multiple files). The server code should be extremely well structured and readable, code quality is very important here.

Design system

build a design system contained in a single html file with vanilla css, no javascript. the design system is for an ai company building fully open source llms and classification models. they are trying to build the future, so the design should be futuristic, but still grounded and human.