Phone mockup
Phone mockup shows a mockup of an iPhone.
This page is not up to date. Some of the examples might not work as expected.
| Class name | Type | |
|---|---|---|
| mockup-phone | Component | Phone mockup |
| mockup-phone-camera | Part | Camera part |
| mockup-phone-display | Part | Display part |
Hi.
<div class="$$mockup-phone"> <div class="$$camera"></div> <div class="$$display"> <div class="$$artboard $$artboard-demo $$phone-1">Hi.</div> </div> </div>
<div class="$$mockup-phone">
<div class="$$camera"></div>
<div class="$$display">
<div class="$$artboard $$artboard-demo $$phone-1">Hi.</div>
</div>
</div>
<div class="$$mockup-phone">
<div class="$$camera"></div>
<div class="$$display">
<div class="$$artboard $$artboard-demo $$phone-1">Hi.</div>
</div>
</div>
<div class="$$mockup-phone">
<div class="$$camera"></div>
<div class="$$display">
<div class="$$artboard $$artboard-demo $$phone-1">Hi.</div>
</div>
</div>Hi.
<div class="$$mockup-phone border-primary"> <div class="$$camera"></div> <div class="$$display"> <div class="$$artboard $$artboard-demo $$phone-1">Hi.</div> </div> </div>
<div class="$$mockup-phone border-primary">
<div class="$$camera"></div>
<div class="$$display">
<div class="$$artboard $$artboard-demo $$phone-1">Hi.</div>
</div>
</div>
<div class="$$mockup-phone border-primary">
<div class="$$camera"></div>
<div class="$$display">
<div class="$$artboard $$artboard-demo $$phone-1">Hi.</div>
</div>
</div>
<div class="$$mockup-phone border-primary">
<div class="$$camera"></div>
<div class="$$display">
<div class="$$artboard $$artboard-demo $$phone-1">Hi.</div>
</div>
</div>Do you have a question? ask the community
Do you see a bug? open an issue on GitHub
Do you like daisyUI? tweet about it!
Support daisyUI's development: Open Collective
