Dynamic Mockups
Use Dynamic Mockups with AI apps and agents through Vercel Connect. Follow a complete setup guide for secure runtime access.
Install the skill
$ npx skills add vercel/vercel-plugin --skill vercel-connectConnect to
Dynamic Mockups$ vercel connect create dynamic-mockups --name acme-dynamic-mockupsUse its data in agents(opens in new tab) and apps(opens in new tab)
import { getToken } from '@vercel/connect';const token = await getToken('dynamic-mockups/acme-dynamic-mockups');
Use Dynamic Mockups in apps and agents
Generate product mockups and render templates with AI-powered media tools.
Read the Dynamic Mockups developer docs(opens in new tab)Why use Vercel Connect with Dynamic Mockups?
Credentials on demand
Request Dynamic Mockups credentials only when your application or agent needs them instead of copying secrets into application code.
Access for the right subject
Keep app-scoped Dynamic Mockups access behind a reusable connector controlled by your team.
Centralized credential management
Manage Dynamic Mockups credentials in one place and retrieve them through a consistent runtime API.
Vercel-native controls
Bind connections to the projects and environments that need them while Vercel OIDC authenticates each runtime request.
Use Dynamic Mockups with your stack
Follow a complete setup for the Connect SDK or a supported agent framework.
Add Dynamic Mockups to an existing Vercel application with the Connect SDK.
Install the Connect SDK
npm install @vercel/connectCreate the Dynamic Mockups connector
Run these commands from the project that will use the connection.
vercel linkvercel connect create dynamic-mockups --name acme-dynamic-mockupsvercel env pullRequest Dynamic Mockups credentials
app/api/route.tsimport { getToken } from '@vercel/connect';const token = await getToken('dynamic-mockups/acme-dynamic-mockups');