Dusk gradient

404 page over a dusk sky with a glowing horizon.

Usage

import { NotFoundGradient } from '@/components/blocks/not-found-03'


<NotFoundGradient />


// Swap in your own content
<NotFoundGradient
  title="This trail ends here"
  description="The link may be broken, or the page has moved on."
  primaryAction={{ label: 'Back to dashboard', href: '/dashboard' }}
  secondaryAction={{ label: 'Contact support', href: '/support' }}
/>

Install

pnpm dlx shadcn@latest add @pastaui-pro/not-found-03

npx shadcn@latest add @pastaui-pro/not-found-03

yarn dlx shadcn@latest add @pastaui-pro/not-found-03

bunx --bun shadcn@latest add @pastaui-pro/not-found-03

Source

Props

Dusk gradient props
Prop	Type	Default	Description
code	string	= '404'	Large digits shown above the horizon line.
title	string	= 'Lost somewhere past the horizon'	Main headline, rendered as the page h1.
description	string	= Short friendly note	Supporting text under the headline.
primaryAction	NotFoundGradientLink	= { label: 'Back to home', href: '/' }	Label and href for the solid pill button.
secondaryAction	NotFoundGradientLink	= undefined	Optional second, frosted glass button. Hidden unless you pass one.
className	string	= undefined	Extra classes for the section, e.g. a fixed min height.