# Mockup components

> Showcase your UI designs with 12 responsive mockup components for React and Next.js, styled beautifully with Tailwind CSS.

38 components available. Showing all of them below.

- [Iphone Mockup](https://21st.dev/@lovesickfromthe6ix/components/iphone-mockup/wallpaper.md) — by scott clayton
- [Iphone Mockup](https://21st.dev/@lovesickfromthe6ix/components/iphone-mockup.md) — by scott clayton
- [Iphone Mockup](https://21st.dev/@lovesickfromthe6ix/components/iphone-mockup/notch.md) — by scott clayton
- [iPhone 15 Pro](https://21st.dev/@dillionverma/components/iphone-15-pro.md) — by Dillion Verma
- [Animated 3D MacBook Air](https://21st.dev/@easemize/components/animated-3d-mac-book-air.md) — by Hossain Jahed
- [Safari](https://21st.dev/@ruixen.ui/components/safari-01.md) — by Ruixen UI
- [iPhone 16 Pro](https://21st.dev/@designali-in/components/iphone-16-pro.md) — by Ali Imam
- [Macbook Pro](https://21st.dev/@designali-in/components/macbook-pro.md) — by Ali Imam
- [Safari](https://21st.dev/@designali-in/components/safari.md) — by Ali Imam
- [Safari](https://21st.dev/@dillionverma/components/safari.md) — by Dillion Verma
- [Phone Mockups 1](https://21st.dev/@solaceui/components/phone-mockups-1.md) — by Solace UI
- [Browser](https://21st.dev/@designali-in/components/browser.md) — by Ali Imam
- [Mac](https://21st.dev/@designali-in/components/mac.md) — by Ali Imam
- [Browser Simulator](https://21st.dev/@muhammad-binsalman/components/browser-simulator.md) — by M.bin Salman
- [Container Scroll Animation](https://21st.dev/@manuarora700/components/container-scroll-animation.md) — by Manu Arora
- [Hero Section 1](https://21st.dev/@meschacirung/components/hero-section-1.md) — by Méschac Irung
- [Cinematic landing Hero](https://21st.dev/@easemize/components/cinematic-landing-hero.md) — by Hossain Jahed
- [Hero with Mockup](https://21st.dev/@serafimcloud/components/hero-with-mockup.md) — by Serafim
- [Section With Mockup](https://21st.dev/@aghasisahakyan1/components/section-with-mockup.md) — by Erik X
- [Hero Section 2](https://21st.dev/@meschacirung/components/hero-section-2.md) — by Méschac Irung
- [Hero 3](https://21st.dev/@sshahaider/components/hero-3.md) — by Efferd
- [Features 6](https://21st.dev/@meschacirung/components/features-6.md) — by Méschac Irung
- [Browser Preview](https://21st.dev/@aghasisahakyan1/components/browser-preview.md) — by Erik X
- [Hero with Product Mockup](https://21st.dev/@vaib215/components/hero-with-product-mockup.md) — by Vaibhav Kumar Singh
- [Download Options Section](https://21st.dev/@ravikatiyar162/components/download-options-section.md) — by Ravi Katiyar
- [Hero Section 06](https://21st.dev/@ruixen.ui/components/hero-section06.md) — by Ruixen UI
- [Macbook Keyboard](https://21st.dev/@kaif-ui/components/macbook-keyboard.md) — by Kaif UI
- [RetroDvdTv](https://21st.dev/@rahil1202/components/retro-dvd-tv.md) — by Rahil Vahora
- [Auth Section 3](https://21st.dev/@solaceui/components/auth-section-3.md) — by Solace UI
- [Chat Messages](https://21st.dev/@solaceui/components/chat-messages-2.md) — by Solace UI
- [Content Block](https://21st.dev/@meschacirung/components/content-block/content-page.md) — by Méschac Irung
- [Financial Hero Section](https://21st.dev/@uilayout.contact/components/hero-financial.md) — by UI Layouts
- [Magic Keyboard Component](https://21st.dev/@muhammad-binsalman/components/magic-keyboard-component.md) — by M.bin Salman
- [Hero with Dashboard Mockup](https://21st.dev/@felipemenezes098/components/hero-02.md) — by felipemenezes098
- [Hero AI Value Proposition](https://21st.dev/@uilayout.contact/components/hero-ai-value-proposition.md) — by UI Layouts
- [Footer Section 2](https://21st.dev/@solaceui/components/footer-section-2.md) — by Solace UI
- [Coming Soon Waitlist](https://21st.dev/@7ovr/components/coming-soon-2.md) — by 7Ovr
- [Domain Stack](https://21st.dev/@ziegfiroyt/components/browser28.md) — by Beste

Full component directory: https://21st.dev/llms.txt