# Android Mockup

> A polished, production-ready Android device mockup component for React. This SVG-based component is fully responsive, supporting light and dark themes, and adapts smoothly to its parent container. The screen area maintains consistent bezel thickness whether displaying an image, video, or blank background—ensuring visual accuracy for all UI demos.  Key features:  Scalable and responsive: SVG scales with its container while preserving the correct device aspect ratio and internal proportions.  Realistic device chrome: Includes speaker and centered camera cutout at the top edge, styled for modern Android hardware.  Flexible display: Easily showcase app screenshots, video walkthroughs, or a blank canvas in the main display region.  Theming built-in: Works with Tailwind CSS utility classes for seamless light/dark switching.  Clean code structure: Typed props, accessible labels, and maintainable design, following 21st.dev and shadcn/ui standards.  Zero external dependencies and easy copy-paste integration.  Ideal for product showcases, onboarding screens, mobile previews, and design system documentation.

- Author: [Arunachalam](https://21st.dev/@arunachalam)
- License: unknown
- Live preview: https://21st.dev/@arunachalam/components/android-mockup

## Install

```bash
npx shadcn@latest add "https://21st.dev/r/arunachalam/android-mockup?api_key=$API_KEY_21ST"
```

Requires a 21st API key (generate one at https://21st.dev/mcp) passed as `API_KEY_21ST`. Free accounts get a limited number of installs per day; unlimited on a paid plan — see https://21st.dev/pricing.

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