AI chat mockup

An AI assistant interface with chat history, prompt, structured answer and a modern composer.

Drop your screenshot here

Size

Format

Your image stays in your browser — nothing is uploaded.

Building an AI product? This template draws a familiar AI-assistant layout: chat history sidebar, a user prompt, a structured answer with options and bullet points, feedback actions and a rounded composer with attach, search and voice.

Put your product name in and it appears as the model name at the top.

Examples

AI Chat mockup on MacBook Pro 14-inch, floating 3DAI Chat on MacBook Pro 14-inch Mockup — Floating 3DAI Chat mockup on iPhone 17 Pro, left angleAI Chat on iPhone 17 Pro Mockup — Left AngleAI Chat mockup on Browser Window, dark modeAI Chat on Browser Window Mockup, Dark ModeAI Chat mockup on MacBook Pro 14-inch and iPhone 17 Pro, right angleAI Chat on MacBook Pro 14-inch and iPhone 17 Pro Mockup — Right Angle

How it works

  1. Choose a screen

    Pick one of 18 interface types (5 layouts each) or upload your own screenshot. Press “New variant” until you like it.

  2. Choose a device

    Put it on an iPhone 17 Pro, iPhone Air, MacBook Pro or MacBook Air — or show it in a browser window.

  3. Download

    Pick an angle and background, then download a high-resolution PNG, JPG or WebP. Transparent background works too.

Questions

Can I name the assistant?

Type a product name and it replaces the model name in the header.

Is there a dark version?

Yes, choose Dark — the mono accent gives a very minimal look.

Can I show it on a phone?

Yes, the iPhone version shows a mobile AI chat with suggestion chips.

Is UI Generator free?

Yes. Every interface, device, angle and export size is free, and you don’t need an account. You can use the images in commercial projects.

Can I put my own screenshot on an iPhone or MacBook?

Yes. Click “Your screenshot”, drag an image onto the preview or paste it with Ctrl/Cmd+V. Your image is processed in your browser and is never uploaded.

More mockups