# AuthShowcase

> The AuthShowcase component is a modern, developer-friendly section designed to showcase authentication code snippets in an interactive and visually appealing way. It combines a textual marketing area on the left—highlighting the benefits of secure and fast authentication—with a tabbed code display on the right. Users can switch between popular languages like JavaScript, Python, Go, and Ruby, instantly previewing the corresponding code sample in a uniform, fixed-size code block. The code block features a clean dark theme, a header displaying the filename, and a convenient copy-to-clipboard button to make it easy for developers to grab the code. Its layout is fully responsive, making it ideal for landing pages, documentation sites, or product showcases where demonstrating API usage or integrations is key.

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

## Install

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