# Not found 2

> Minimalist 404 page featuring large masked typography and clear navigation actions.

A shadcn/ui block from the [@efferd](https://efferd.com/) registry, listed on [shadcn.exchange](https://shadcn.exchange/r/efferd/not-found-2).

- Page, with a live preview: https://shadcn.exchange/r/efferd/not-found-2
- Screenshot: https://abzjhwgwpdpz7ua5.public.blob.vercel-storage.com/shots/efferd/not-found-2-light-bebcedf53b04bc83.png
- Registry item: https://efferd.com/r/not-found-2.json
- Categories: not-found
- Listed: 2026-10-13, source last changed 2026-10-13

## Install

```bash
npx shadcn@latest add https://efferd.com/r/not-found-2.json
```

Run it in a project that has shadcn/ui set up. It adds the files below and installs what they depend on.

## Dependencies

- Registry items: `button`, `empty`

## Files

### `registry/blocks/not-found/2/index.tsx`

```tsx
import { Button } from "@/components/ui/button";
import {
	Empty,
	EmptyContent,
	EmptyDescription,
	EmptyHeader,
	EmptyTitle,
} from "@/components/ui/empty";

export function NotFoundPage() {
	return (
		<div className="relative flex min-h-screen w-full items-center justify-center overflow-hidden">
			<Empty>
				<EmptyHeader>
					<EmptyTitle className="mask-b-from-20% mask-b-to-80% font-extrabold font-heading text-9xl">
						404
					</EmptyTitle>
					<EmptyDescription className="-mt-8 text-nowrap text-foreground/80">
						The page you're looking for might have been <br />
						moved or doesn't exist.
					</EmptyDescription>
				</EmptyHeader>
				<EmptyContent>
					<div className="flex gap-2">
						<Button asChild>
							<a href="#">
								<IconPlaceholder
									data-icon="inline-start"
									hugeicons="Home01Icon"
									lucide="HomeIcon"
									phosphor="HouseIcon"
									remixicon="RiHomeLine"
									tabler="IconHome"
								/>
								Go Home
							</a>
						</Button>

						<Button asChild variant="outline">
							<a href="#">
								<IconPlaceholder
									data-icon="inline-start"
									hugeicons="CompassIcon"
									lucide="CompassIcon"
									phosphor="CompassIcon"
									remixicon="RiCompassLine"
									tabler="IconCompass"
								/>{" "}
								Explore
							</a>
						</Button>
					</div>
				</EmptyContent>
			</Empty>
		</div>
	);
}
```
