| <!doctype html> |
| <html lang="en"> |
| <head> |
| <meta charset="utf-8"> |
| <meta name="viewport" content="width=device-width,initial-scale=1"> |
| <title>QBench Leaderboard</title> |
| <link rel="preconnect" href="https://fonts.googleapis.com"> |
| <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> |
| <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&family=JetBrains+Mono:wght@400;500&family=Space+Grotesk:wght@600;700&display=swap" rel="stylesheet"> |
| <style> |
| :root { |
| --bg: #f3f6fc; --surface: #ffffff; --surface-2: #eef3fb; --line: rgba(23,53,102,.12); |
| --text: #10192b; --muted: #52627d; --brand: #2f6fd0; --cyan: #1596cf; |
| --grad: linear-gradient(120deg,#5277df 0%,#438de9 52%,#35b7e4 100%); |
| --f-display: "Space Grotesk", system-ui, sans-serif; --f-body: "Inter", system-ui, sans-serif; |
| --f-mono: "JetBrains Mono", ui-monospace, monospace; |
| } |
| @media (prefers-color-scheme: dark) { |
| :root { --bg:#070b16; --surface:#0e1526; --surface-2:#121b30; --line:rgba(120,160,220,.16); |
| --text:#eaf1fb; --muted:#8a9bb8; --brand:#5b9df0; --cyan:#35b7e4; } |
| } |
| * { box-sizing: border-box; } |
| body { margin:0; background:var(--bg); color:var(--text); font-family:var(--f-body); line-height:1.55; } |
| .wrap { max-width: 980px; margin: 0 auto; padding: 48px 20px 80px; } |
| .brand { display:flex; align-items:center; gap:10px; margin-bottom: 28px; font-family:var(--f-display); font-weight:700; } |
| .brand img { width: 30px; height: 30px; } |
| h1 { font-family: var(--f-display); font-size: clamp(1.7rem,4vw,2.3rem); margin: 0 0 8px; } |
| .lede { color: var(--muted); max-width: 65ch; margin: 0 0 32px; } |
| .lede code { font-family: var(--f-mono); background: var(--surface-2); padding: 1px 6px; border-radius: 5px; font-size: .92em; } |
| table { width: 100%; border-collapse: collapse; background: var(--surface); border: 1px solid var(--line); border-radius: 14px; overflow: hidden; } |
| thead th { text-align: left; font-family: var(--f-display); font-size: .82rem; text-transform: uppercase; letter-spacing: .03em; color: var(--muted); padding: 14px 16px; background: var(--surface-2); } |
| tbody td { padding: 13px 16px; border-top: 1px solid var(--line); font-size: .95rem; } |
| tbody tr:hover { background: var(--surface-2); } |
| .model-cell { font-family: var(--f-mono); font-size: .88rem; } |
| .num { font-variant-numeric: tabular-nums; } |
| .best { color: var(--brand); font-weight: 600; } |
| .foot { margin-top: 22px; color: var(--muted); font-size: .88rem; } |
| .foot a { color: var(--brand); } |
| .status { color: var(--muted); padding: 40px 0; text-align: center; } |
| .table-wrap { overflow-x: auto; } |
| @media (max-width: 640px) { table { font-size: .85rem; } thead th, tbody td { padding: 10px 10px; } } |
| </style> |
| </head> |
| <body> |
| <div class="wrap"> |
| <div class="brand"> |
| <img src="Q_Logo.svg" alt=""> |
| <span>Q Project</span> |
| </div> |
| <h1>QBench Leaderboard</h1> |
| <p class="lede">A small, model-agnostic benchmark for small (<1B parameter) language models: tool-use |
| (single-turn and an 8-turn natural-phrasing conversation) plus ARC-Easy and TruthfulQA MC1. No model — |
| including the Q Project's own — gets forced-correct tool execution; every score reflects what the model |
| actually generates on its own. Run it yourself and submit a result: see the |
| <a href="https://github.com/Q-Project-LM/QBench" target="_blank" rel="noopener">GitHub repo</a>.</p> |
|
|
| <div class="table-wrap"> |
| <table id="tbl" style="display:none"> |
| <thead> |
| <tr><th>Model</th><th>Params</th><th>Single-turn</th><th>Multi-turn</th><th>Collapses</th><th>ARC-Easy</th><th>TruthfulQA MC1</th><th>Submitted by</th></tr> |
| </thead> |
| <tbody id="rows"></tbody> |
| </table> |
| <p class="status" id="status">Loading leaderboard…</p> |
| </div> |
| <p class="foot">Data: <a href="https://huggingface.co/datasets/q-project/qbench-results" target="_blank" rel="noopener">q-project/qbench-results</a> on the Hub, updated whenever someone submits a run via the CLI.</p> |
| </div> |
| <script> |
| async function load() { |
| const status = document.getElementById('status'); |
| try { |
| const res = await fetch('https://huggingface.co/datasets/q-project/qbench-results/raw/main/results.json', { cache: 'no-store' }); |
| if (!res.ok) throw new Error('HTTP ' + res.status); |
| const rows = await res.json(); |
| rows.sort((a, b) => ((b.single_turn_score||0)+(b.multi_turn_score||0)) - ((a.single_turn_score||0)+(a.multi_turn_score||0))); |
| const pct = (x) => x == null ? '—' : (x*100).toFixed(1) + '%'; |
| const bestArc = Math.max(...rows.map(r => r.arc_easy_accuracy || 0)); |
| const bestTqa = Math.max(...rows.map(r => r.truthfulqa_mc1_accuracy || 0)); |
| const tbody = document.getElementById('rows'); |
| tbody.innerHTML = rows.map(r => ` |
| <tr> |
| <td class="model-cell">${r.model_id}</td> |
| <td class="num">${r.params || '—'}</td> |
| <td class="num">${pct(r.single_turn_score)}</td> |
| <td class="num">${pct(r.multi_turn_score)}</td> |
| <td class="num">${r.repetition_collapses ?? '—'}</td> |
| <td class="num${r.arc_easy_accuracy === bestArc ? ' best' : ''}">${pct(r.arc_easy_accuracy)}</td> |
| <td class="num${r.truthfulqa_mc1_accuracy === bestTqa ? ' best' : ''}">${pct(r.truthfulqa_mc1_accuracy)}</td> |
| <td>${r.submitted_by || '—'}</td> |
| </tr>`).join(''); |
| document.getElementById('tbl').style.display = ''; |
| status.style.display = 'none'; |
| } catch (e) { |
| status.textContent = 'Could not load the leaderboard (' + e.message + '). Try refreshing.'; |
| } |
| } |
| load(); |
| </script> |
| </body> |
| </html> |
|
|
