---
title: 404 Page with logo
category: Marketing
paid: false
isActive: true
ltr: {"html":{"htmlTail":[{"label":"index.html","code":"<main>\n    <div class=\"max-w-screen-xl mx-auto px-4 flex items-center justify-start h-screen md:px-8\">\n        <div class=\"max-w-lg mx-auto text-center\">\n            <div class=\"pb-6\">\n                <img src=\"https://farmui.com/logo.svg\" width={150} class=\"mx-auto\" />\n            </div>\n            <h3 class=\"text-gray-800 text-4xl font-semibold sm:text-5xl\">\n                Page not found\n            </h3>\n            <p class=\"text-gray-600 mt-3\">\n                Sorry, the page you are looking for could not be found or has been removed.\n            </p>\n        </div>\n    </div>\n</main>"}]},"react":{"jsxCss":[],"jsxTail":[{"label":"App.jsx","code":"export default () => {\n    return (\n        <main>\n            <div className=\"max-w-screen-xl mx-auto px-4 flex items-center justify-start h-screen md:px-8\">\n                <div className=\"max-w-lg mx-auto text-center\">\n                    <div className=\"pb-6\">\n                        <img src=\"https://farmui.com/logo.svg\" width={150} className=\"mx-auto\" />\n                    </div>\n                    <h3 className=\"text-gray-800 text-4xl font-semibold sm:text-5xl\">\n                        Page not found\n                    </h3>\n                    <p className=\"text-gray-600 mt-3\">\n                        Sorry, the page you are looking for could not be found or has been removed.\n                    </p>\n                </div>\n            </div>\n        </main>\n    )\n}"}]},"vue":{"vueTail":[{"label":"App.vue","code":"<template>\n  <main>\n    <div class=\"max-w-screen-xl mx-auto px-4 flex items-center justify-start h-screen md:px-8\">\n        <div class=\"max-w-lg mx-auto text-center\">\n            <div class=\"pb-6\">\n                <img src=\"https://farmui.com/logo.svg\" width={150} class=\"mx-auto\" />\n            </div>\n            <h3 class=\"text-gray-800 text-4xl font-semibold sm:text-5xl\">\n                Page not found\n            </h3>\n            <p class=\"text-gray-600 mt-3\">\n                Sorry, the page you are looking for could not be found or has been removed.\n            </p>\n        </div>\n    </div>\n  </main>\n</template>"}],"vueCss":[]},"svelte":{"svelteTail":[{"label":"App.svelte","code":"<main style=\"height: 680px\">\n    <div class=\"max-w-screen-xl mx-auto px-4 flex items-center justify-start h-screen md:px-8\">\n        <div class=\"max-w-lg mx-auto text-center\">\n            <div class=\"pb-6\">\n                <img src=\"https://farmui.com/logo.svg\" width={150} class=\"mx-auto\" />\n            </div>\n            <h3 class=\"text-gray-800 text-4xl font-semibold sm:text-5xl\">\n                Page not found\n            </h3>\n            <p class=\"text-gray-600 mt-3\">\n                Sorry, the page you are looking for could not be found or has been removed.\n            </p>\n        </div>\n    </div>\n</main>"}]},"preview":"function App() {\n    return (\n        <main>\n            <div className=\"max-w-screen-xl mx-auto px-4 flex items-center justify-start h-screen md:px-8\">\n                <div className=\"max-w-lg mx-auto text-center\">\n                    <div className=\"pb-6\">\n                        <img src=\"https://farmui.com/logo.svg\" width={150} className=\"mx-auto\" />\n                    </div>\n                    <h3 className=\"text-gray-800 text-4xl font-semibold sm:text-5xl\">\n                        Page not found\n                    </h3>\n                    <p className=\"text-gray-600 mt-3\">\n                        Sorry, the page you are looking for could not be found or has been removed.\n                    </p>\n                </div>\n            </div>\n        </main>\n    )\n}"}
slug: /404-pages
id: 1c645a68-e17f-4738-9822-708eee4dee17
created_at: 1671312965966
---

<FUI404PageWithLogo />