uğur sözen

Inline 404 Line

Component 2

About

A minimal 404 error page layout that shows the status code and heading side by side on one line separated by a divider, with a single outline button to go back home.

Built with React and Tailwind. Copy the prompt and paste it into Claude Code, Cursor or Lovable: your agent adds Inline 404 Line to your project and fits it to your theme.

Code

How Inline 404 Line is used: the demo's code. The component's own source comes with a free account.

Usage.tsx

import Error6 from "@/components/ui/error6";

export default function Error6Demo() {
  return (
    <Error6
      code="404"
      heading="This page could not be found"
      description="The link is broken or the page has been removed."
      link={{ label: "Back to home", href: "https://beste.co" }}
    />
  );
}

Dependencies

More by uğur sözen

View all
  • Worth Keeping CTA

    Worth Keeping CTA

    206
  • Comparison Slider with Highlights

    Comparison Slider with Highlights

    191
  • Before/After Image Slider

    Before/After Image Slider

    121
  • Invoice History Table

    Invoice History Table

    66
  • Recipe Card

    Recipe Card

    38
  • PIN Keypad Unlock

    PIN Keypad Unlock

    34
  • Trigger to Action

    Trigger to Action

    34
  • Shop by Category Grid

    Shop by Category Grid

    33