AI playgroundPro

• System prompt and temperature
• Reasoning trace
• Parallel streaming
• Tokens and cost

• Prompt engineering and model evaluation tools.

• End-user chat.

Import it from @/components/blocks/ai-playground after installing. It ships with sample data, so it renders straight away; swap in your own data when you're ready.

import { AiPlayground } from "@/components/blocks/ai-playground";

export default function Page() {
  return (
    <main className="mx-auto max-w-6xl p-6">
      <AiPlayground />
    </main>
  );
}

• Sliders and switches are labelled.

• Both answers stream in parallel; reasoning folds away when done.

• Model columns stack below 768px.

• Streams are simulated; nothing is sent.

• Call your models from a server route and stream back to each column.