Mockup
A flexible mockup component that displays screenshots in beautiful frames, perfect for responsive layouts and mobile device mockups.
This specialized mockup component is designed for showcasing screenshots and visual content within elegant frames on marketing websites. The goal of the mockup component is to show screenshots in a nice frame, making it easy to display them either as flexible responsive elements or fixed-width elements for mobile mockups.
Built with class-variance-authority (CVA), it provides consistent styling with built-in shadow effects, border treatments, and responsive behavior. The component handles the complexity of framing while maintaining optimal visual presentation across all devices.
Installation
Set up project
If you haven't done that already, follow the installation guide before installing your first component.
Install components and dependencies
npx shadcn@latest add "https://launchuicomponents.com/r/mockup"
This command will:
- install necessary dependencies and add them to
package.json - add necessary components to
components/ui
Start using your component
Your component is ready to use!
Usage
Need help?
File a feature request, report a bug, or ask me anything.