# Sign in — Detent

> Google or GitHub in one press, or a code by email. Then pick a workspace and you’re in.

Canonical: https://detentui.com/blocks/sign-in
Last updated: 2026-11-10

## About

Google or GitHub in one press, or a code by email. Then pick a workspace and you’re in.

## Details

- Google and GitHub sit first, with their real marks. GitHub asks for consent the way GitHub does: who’s asking, exactly what they’ll see, and one green button.
- The email code arrives the way it does on a phone: a notification you can tap, and a suggestion under the field that fills it in.
- Every stage holds the same place and crossfades, so nothing on the page moves between them.
- The line under the email field is held for the hint or the error, so the button below it never jumps.
- A wrong code shakes and clears from the end; a right one fuses the cells and sweeps green.
- Beside the form, what’s waiting on the other side keeps its shape with its words redacted. Once you’re in, the rows come into focus one by one, each in the space it already had.
- Below 896px the form has the window to itself. The providers, the product, the workspaces and what’s waiting are all props.

## Keyboard shortcuts

| Keys | Action |
| --- | --- |
| Enter | Continue |
| ⌘ V | Paste a code |

## Install

```bash
npx shadcn add https://detentui.com/r/sign-in
```

## Related
- [All blocks](https://detentui.com/blocks)
- [Pro](https://detentui.com/pro)