404 pageModern UINo props
A sophisticated animated 404 page with smooth transitions and gradient effects, perfect for contemporary web applications.
Preview
Installation
1Run the following command in your terminal:
npm terminal
npx 404lab@latest add modernThis will add the ModernPage component to your project automatically.
Usage
Import and render the component in your not-found.tsx file:
not-found.tsx
import ModernPage from "@/components/404/ModernPage"
export default function NotFoundPage() {
return Props
| Prop | Type | Default | Description |
|---|---|---|---|
| className | string | — | Additional CSS classes for styling the container. |
This component requires no props by default. Just drop it in and it works!
Features
Smooth Animations
Fluid CSS transitions and Framer Motion effects for a premium feel.
Gradient Overlays
Modern color palettes with beautiful mesh and linear gradients.
Glassmorphism
Frosted glass effects and subtle blurs that fit modern design trends.
Fully Responsive
Optimized layouts for every screen size, from mobile to ultra-wide.
Interactive Focus
Engaging hover states and touch-friendly elements that encourage exploration.