Home
TailwindFlex
404 page template

404 page template

Minimal 404-page template for tailwind css

This tailwind example is contributed by TailwindFlex, on 07-Jan-2023. Component is made with Tailwind CSS v3. It is responsive. similar terms for this example are 404 pages,Not found

404 Page

Author TailwindFlex

12.7k

Fork Fullscreen

<div class='flex items-center justify-center w-full min-h-[70vh] text-gray-900 my-12 px-4'>
    <div class='flex flex-col items-center w-full gap-8'>
        <h1 class='text-9xl md:text-16xl w-full select-none text-center font-black text-gray-400'>
            404
        </h1>
        <p class='text-3xl font-semibold text-center'>You have discovered a secret place</p>
        <p class='text-2xl md:px-12 text-center'>
            Unfortunately, this is only a 404 page. You may have
            mistyped the address, or the page has been moved to another URL.
        </p>
        <div class='flex flex-row justify-between gap-8'>
            <a href="#"
                class='flex justiy-center items-center px-5 py-2 text-xl rounded-md text-black border border-indigo-500 hover:bg-indigo-500 hover:text-white'>
                Previous Page
            </a>
            <a href="/"
                class='flex justiy-center items-center px-5 py-2 text-xl rounded-md text-black border border-green-500 hover:bg-green-500 hover:text-white'>
                Home Page
            </a>
        </div>
    </div>
</div>

Related Examples

404 Error Page
Minimal 404 for your project

Author:
TailwindFlex

3 years ago

22.1k
Minimal 404 page

Author:
Santos78

3 years ago

11.7k
Simple 404 page template

Author:
Livia Flores

3 years ago

14.3k
Minimal server error page template

Author:
Santos78

3 years ago

13.4k
Beautiful 404 page
404 page with background image

Author:
Nikolai

1 year ago

3.5k
404 Error card
Error card at the center

Author:
Shakti

2 years ago

9.6k
404 Page Example

Author:
Brandon D

3 years ago

12.9k
3D. Éléments. HTML 404.
3D. Éléments. HTML 404.

Author:
Omer fils ELENGA

4 weeks ago

86
Animated 404 Error Page Section
A modern and minimal 404 error page section built with Tailwind CSS and Alpine.js. This component features a smooth fade-in animation triggered on page load, a bold 404 error code, a short message, and a primary call-to-action button guiding users back to the homepage. ✨ Key Features: Smooth fade & slide-in animation using Alpine.js Fully responsive and optimized for mobile and dark mode Clean Tailwind CSS styling for easy customization Includes a call-to-action button for better UX Perfect for: landing pages, web apps, and portfolios that need a polished “Page Not Found” experience.

Author:
wavy kits

3 months ago

435
Page not found
When lost get help to get back home

Author:
ORGIN_DREAMS

8 months ago

941
plugin
test description

Author:
Anonymous

1 year ago

2.2k
Minimal 404 Page Template

Author:
Lautaro Gómez

1 year ago

2.4k

Explore components by Tags

Didn't find component you were looking for?

Search from 3000+ components