infisical/frontend/src/pages/404.tsx

import Head from 'next/head';
import Image from 'next/image';
import Link from 'next/link';

export default function Custom404() {
  return (
    <div className='bg-bunker-800 md:h-screen flex flex-col justify-between'>
      <Head>
        <title>Infisical | Page Not Found</title>
        <link rel='icon' href='/infisical.ico' />
      </Head>
      <div className='flex flex-col items-center justify-center text-gray-200 h-screen w-screen'>
        <p className='text-4xl mt-32'>Oops, something went wrong</p>
        <p className='mt-2 mb-1 text-lg'>
          Think this is a mistake? Email{' '}
          <a
            className='text-primary underline underline-offset-4'
            href='mailto:[email protected]'
          >
            team@infisical.com
          </a>{' '}
          and we`ll fix it!{' '}
        </p>
        <Link
          href='/dashboard'
          className='bg-mineshaft-500 mt-8 py-2 px-4 rounded-md hover:bg-primary diration-200 hover:text-black cursor-pointer font-semibold'
        >
          Go to Dashboard
        </Link>
        <Image
          src='/images/dragon-404.svg'
          height={554}
          width={942}
          alt='infisical dragon - page not found'
         />
      </div>
    </div>
  );
}