Response Compare
A shared prompt panel above two side by side response cards, each with a model badge, answer body, latency and token stats, and a prefer button.
A shared prompt panel above two side by side response cards, each with a model badge, answer body, latency and token stats, and a prefer button.
Search blocks by description or jump to a page.
The source for every Application block is included with Basic and Pro. Pick a plan to copy the code.
Already purchased? Log in
Response Compare puts two model answers to the same prompt side by side. The shared question sits in a quoted panel at the top, and two response cards follow, one from a fast model and one from a reasoning model. Each card carries a model badge, the answer body as paragraphs and optional bullets, a latency and token line, and a prefer button. A footer explains that the preference is saved with the question type so similar questions route to the chosen model by default.
Responses live in one array where bullets are optional, so a terse answer and a fuller one share the same card shape. Showing latency and tokens next to each answer is what turns a taste call into a cost and speed tradeoff the user can reason about.
Reach for this block on an evaluation screen or a model settings page whenever a user picks between models for a task. Wire the prefer button to your routing rules so the choice takes effect on the next matching question.
A natural flow around it on an Application Pro page:
Before
After
One strong use is the model preference picker. Other side by side comparisons:
Tip: keep both answers to the same real question; a rigged or uneven prompt makes the comparison meaningless.