iPad Mockup

CSS-only iPad device frames for showcasing tablet apps and designs.

Your App
1import { iPadMockup } from "@/zeroui/components/mockups";
2
3export default function Example() {

Orientation

Portrait
Portrait
Landscape
Landscape
1<IPadMockup orientation="portrait" />
2<IPadMockup orientation="landscape" />

Models

Pro 12.9"
Pro 12.9"
Pro 11"
Pro 11"
Air
Air
Mini
Mini
1<IPadMockup model="pro-12.9" />
2<IPadMockup model="pro-11" />
3<IPadMockup model="air" />

Colors

Space Gray
Silver
1<IPadMockup color="space-gray" />
2<IPadMockup color="silver" />

Props

Props

nametypedefaultdescription
childrenReactNode--
model"pro-12.9" | "pro-11" | "air" | "mini""pro-11"-
color"space-gray" | "silver""space-gray"-
scalenumber1-
orientation"portrait" | "landscape""portrait"-
classNamestring""-
screenClassNamestring""-