# Social Auth Card

> The Social Auth First Card is a modern onboarding component built entirely with shadcn UI. It prioritizes social login buttons at the top—Google, GitHub, and LinkedIn—making it quick and easy for users to sign in. Below the social options, an optional traditional login form provides a fallback for email/password authentication. A subtle divider with “or” clearly separates the two sections, maintaining a clean and organized layout. Fully responsive and theme-aware, this card enhances the user experience with a friendly, branded look while supporting both light and dark modes, making it ideal for fast and seamless onboarding.

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

## Install

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