AI Artifacts

2 variants

Composable artifact containers with headers, actions, content, and footers for generated documents, code, and custom outputs.

Code artifact

index.tsx

A compact code artifact using the public beUI agent code renderer, with syntax highlighting, line numbers, copy, and download.

group-tasks.ts

Task grouping utility

typescriptReady
1type Task = {2  id: string;3  title: string;4  completed: boolean;5};67export function groupTasks(tasks: Task[]) {8  return {9    pending: tasks.filter((task) => !task.completed),10    completed: tasks.filter((task) => task.completed),11  };12}
12 linesVersion 1

Document artifact

index.tsx

Preview and edit a document, revisit saved versions, copy content, and download Markdown.

A calmer way to plan

Markdown document

Version 1

A calmer way to plan

Good work starts with a little clarity. We’re building a workspace that helps small teams turn scattered ideas into a plan everyone can follow.

Less organizing. More doing.

Bring your notes, decisions, and next steps together in one place. Keep the context beside the work, so nobody needs to search through yesterday’s messages to understand what comes next.

Built around your day

Start with an idea, shape it with your team, and leave with a clear next step. A quiet interface keeps your attention on the work while the details stay within reach.

Start small

Choose one project. Invite a teammate. Write down the next three things you want to get done. That’s enough to get moving.

126 wordsAll changes saved

Install

Add this component with the shadcn CLI.

$ bunx --bun shadcn add @beui-pro/ai-artifacts