Assistant Wall

AI chats 1

About

A wall of frosted glass assistant cards that glides upward, handing focus to the next friendly message with soft motion blur, glossy avatar spheres and a pink light bloom.

Built with React and Tailwind. Copy the prompt and paste it into Claude Code, Cursor or Lovable: your agent adds Assistant Wall to your project and fits it to your theme.

Code

How Assistant Wall is used: the demo's code. The component's own source comes with a free account.

Usage.tsx

"use client";

import * as React from "react";
import { AssistantWall } from "@/components/ui/assistant-wall";

/** Assistant Wall filling the preview. */
export default function AssistantWallDemo() {
  return (
    <main className="relative h-screen min-h-[340px] w-full overflow-hidden" style={{ backgroundColor: "#0d062d" }}>
      <AssistantWall style={{ width: "100%", height: "100%" }} />
    </main>
  );
}