A 404 page may be accessed very often. Server-rendering an error page for every visit increases the load of the Next.js server. This can result in increased costs and slow experiences.
To avoid the above pitfalls, Next.js provides a static 404 page by default without having to add any additional files.
### Customizing The 404 Page
To create a custom 404 page you can create a `pages/404.js` file. This file is statically generated at build time.
```jsx
// pages/404.js
export default function Custom404() {
return <h1>404 - Page Not Found</h1>
}
```
## 500 Page
By default Next.js provides a 500 error page that matches the default 404 page’s style. This page is not statically optimized as it allows server-side errors to be reported. This is why 404 and 500 (other errors) are separated.
### Customizing The Error Page
500 errors are handled both client-side and server-side by the `Error` component. If you wish to override it, define the file `pages/_error.js` and add the following code: