# BrowserCard

> The BrowserCard component is a reusable, styled React UI element that mimics the look of a mini web browser window. It includes a tab bar, browser controls (back, forward, refresh, minimize, maximize, close), and an address bar with interactive buttons and input. The component is fully customizable through props like tabTitle, url, and navigation state (canGoBack, canGoForward). It’s built with Next.js, TypeScript, Tailwind CSS, and shadcn/ui components for a clean, modern look — perfect for showcasing previews, dashboards, or simulated web pages in a card-like layout.

- Author: [Ruixen UI](https://21st.dev/@ruixen.ui)
- Library: [Ruixen UI](https://21st.dev/@ruixen.ui/library/ruixen-ui)
- License: unknown
- npm dependencies: next, lucide-react
- Live preview: https://21st.dev/@ruixen.ui/components/browser-card

## Install

```bash
npx shadcn@latest add "https://21st.dev/r/ruixen.ui/browser-card?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