Home
Shariar Hasan
File Not Found

File Not Found

This is a simple not found section for file, with full responsiveness and dark mode supported

This tailwind example is contributed by Shariar Hasan, on 29-Feb-2024. Component is made with Tailwind CSS v3. It is responsive. It supports dark mode. similar terms for this example are 404 Pages, Not found

Error Page

Author Shariar Hasan

2.2k

Fork Fullscreen

<div class="no-file-found flex flex-col items-center justify-center py-8 px-4 text-center bg-gray-100 dark:bg-gray-800 rounded-lg shadow-md">
  <svg class="w-12 h-12 dark:text-gray-400 text-gray-700" stroke="currentColor" fill="currentColor" stroke-width="0" viewBox="0 0 24 24" height="200px" width="200px" xmlns="http://www.w3.org/2000/svg"><g id="File_Off"><g><path d="M4,3.308a.5.5,0,0,0-.7.71l.76.76v14.67a2.5,2.5,0,0,0,2.5,2.5H17.44a2.476,2.476,0,0,0,2.28-1.51l.28.28c.45.45,1.16-.26.7-.71Zm14.92,16.33a1.492,1.492,0,0,1-1.48,1.31H6.56a1.5,1.5,0,0,1-1.5-1.5V5.778Z"></path><path d="M13.38,3.088v2.92a2.5,2.5,0,0,0,2.5,2.5h3.07l-.01,6.7a.5.5,0,0,0,1,0V8.538a2.057,2.057,0,0,0-.75-1.47c-1.3-1.26-2.59-2.53-3.89-3.8a3.924,3.924,0,0,0-1.41-1.13,6.523,6.523,0,0,0-1.71-.06H6.81a.5.5,0,0,0,0,1Zm4.83,4.42H15.88a1.5,1.5,0,0,1-1.5-1.5V3.768Z"></path></g></g></svg>
  <h3 class="text-xl font-medium mt-4 text-gray-700 dark:text-gray-200">File not found</h3>
  <p class="text-gray-500 dark:text-gray-400 mt-2">
    The file you are looking for could not be located.
  </p>
</div>

Related Examples

404 Error Page
Minimal 404 for your project

Author:
TailwindFlex

2 years ago

20.7k
404 Page Example

Author:
Brandon D

2 years ago

11.9k
Page not found
When lost get help to get back home

Author:
ORGIN_DREAMS

1 week ago

32
404 Not Found

Author:
Rajesh Maheshwari

3 months ago

688
404 Error
This HTML page displays a 404 error with a 'Back to home' button, styled using Tailwind CSS.

Author:
Zayyan Mustafa

3 months ago

539
404 Page
The 404 Page is a responsive and customizable error page designed to inform users when they’ve reached a nonexistent or broken link. This component not only improves user experience but also provides a chance to showcase creativity and guide users back to the right path. Key Features: Fully responsive design that works on all devices. Engaging visuals (customizable images, icons, or animations). Includes a message like "Page Not Found" or "Oops! Something went wrong." Provides helpful navigation options such as a "Go Home" button or links to other pages. Easily customizable for themes, styles, and content.

Author:
Abhiraj

4 months ago

713
exampleerror

Author:
John Connor

1 week ago

41
Minimal server error page template

Author:
Santos78

2 years ago

12.8k
500 Internal Server Error

Author:
Maxim

2 months ago

266
404 Error Page Example

Author:
Anonymous

6 months ago

1.1k
Animated Ripple Avatar
Ripple Effect Avatar (Tailwind CSS Component) A visually striking animated component that displays a centered avatar or image surrounded by expanding ripple circles. Built with Tailwind CSS and custom animations, this effect simulates a pulsing or water ripple reaction, drawing attention to the central image. Ideal for user profile sections, hero banners, landing pages, or highlighted features in modern web interfaces. The ripples gradually fade and expand, creating a soft, calming motion that enhances interactivity and depth.

Author:
Acode Master(Mfuranziza Dusabe Hamza)

1 week ago

69
Animated Website
Welcome to our animated and engaging website built with Tailwind CSS. We provide top-notch web design, development, SEO, and consulting services to help your business grow.

Author:
Nicole Shalom

1 week ago

52

Explore components by Tags

Didn't find component you were looking for?

Search from 2400+ components