Phone mockup shows a mockup of an iPhone.

Class name
Type
mockup-phone
Component
Phone mockup
mockup-phone-camera
Part
Camera part
mockup-phone-display
Part
Display part

iPhone mockup

It's Glowtime.
<div class="$$mockup-phone">
  <div class="$$mockup-phone-camera"></div>
  <div class="$$mockup-phone-display text-whi0e grid place-content-center bg-neutral-900">
    It's Glowtime.
  </div>
</div>
<div class="$$mockup-phone">
  <div class="$$mockup-phone-camera"></div>
  <div class="$$mockup-phone-display text-whi0e grid place-content-center bg-neutral-900">
    It's Glowtime.
  </div>
</div>

With color and wallpaper

wallpaper
<div class="$$mockup-phone border-[#ff8938]">
  <div class="$$mockup-phone-camera"></div>
  <div class="$$mockup-phone-display">
    <img alt="wallpaper" src="https://img.daisyui.com/images/stock/453966.webp" />
  </div>
</div>
<div class="$$mockup-phone border-[#ff8938]">
  <div class="$$mockup-phone-camera"></div>
  <div class="$$mockup-phone-display">
    <img alt="wallpaper" src="https://img.daisyui.com/images/stock/453966.webp" />
  </div>
</div>
Do you have a question? Ask on GitHub or Discord server
Do you see a bug? open an issue on GitHub
Do you like daisyUI? Post about it!
Support daisyUI's development: Open Collective
daisyUI store

NEXUS
Official daisyUI Dashboard Template

Available on daisyUI store

More details