# image uploader

> This is a reusable ImageUploadField React component built with Next.js and Tailwind CSS. It allows users to upload and preview an image with optional error display, loading skeleton, aspect ratio control, and size restriction. The component supports both file and URL inputs and provides clear UI feedback for upload state, errors, and removal actions. It’s designed to integrate cleanly with forms and supports customization via props like disabled, error, defaultImage, and maxSize.

- Author: [shakeeb](https://21st.dev/@info-mdshakeeb)
- License: unknown
- npm dependencies: next, lucide-react
- Live preview: https://21st.dev/@info-mdshakeeb/components/image-uploader

## Install

```bash
npx shadcn@latest add "https://21st.dev/r/info-mdshakeeb/image-uploader?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