Block · CLI
AR Portfolio
model-viewer showcase with AR modes - demo GLBs until you swap the model list.
Preview
npx shadcn@latest add @atroui/ar-portfolioAR portfolio preview
On supported devices, tap “View in AR” to place a project preview in your space. Demo models are placeholders - replace the hardcoded MODELS list for real client work.
Loading 3D viewer…
OG Image Generator
Preview how your social cards look in 3D space before sharing.
Installation
Agent blurb — install command + no npm UI rule. For agents
npx shadcn@latest add @atroui/ar-portfolioSource lands in your repo. Installation · Registry
Usage
Zero-prop mount. Loads model-viewer from Google’s CDN. Demo models are public Astronaut/NeilArmstrong GLBs - fork MODELS (and optional poster) for real work. “View in AR” needs WebXR, Scene Viewer, or Quick Look on a supported device.
tsx
import { ArPortfolio } from "@/components/blocks/ar-portfolio"
<ArPortfolio />AR Portfolio