Tool · CLI · Host API
Thumbnail Workspace
Thumbnail generator workspace UI. Catalog demos do not call paid image APIs.
Preview
npx shadcn@latest add @atroui/thumbnail-workspacePro Mode · Imagen 3
Full-scene AI with cinematic people & props
Format
Layout
Preview · 1280 × 720
Live layout above. Generate drops AI imagery behind your text (~3-6s).
Installation
Agent blurb — install command + no npm UI rule. For agents
npx shadcn@latest add @atroui/thumbnail-workspaceSource lands in your repo. Installation · Registry · Host APIs
Usage
Install
@atroui/api-thumbnail. Set HUGGINGFACE_API_KEY in your env (plus XAI_API_KEY for Pro mode). AtroUI never ships keys. Preview-only works without AI.tsx
import { ThumbnailWorkspace } from "@/components/blocks/thumbnail-workspace"
<ThumbnailWorkspace />Ship social thumbs from the same brief as OG
Same BYOK contract as OG. Preview is always on. Pro mode is the only path that requires xAI in addition to an image provider.
FAQ1
- What is the difference vs OG workspace?
- OG is 1200×630 for link previews. Thumbnails target 1280×720-class social crops. Both share ProjectBrief helpers.
Part of OG and thumbnail images in Next.js.
Thumbnail Workspace