# Error page

### Usage

Error pages are pages that are shown if there is a critical error occurred in the application caused by the user action or system failure.

Since the error is severe, giving proper feedback with possible options to fix the problem is mandatory. The use of illustration on error pages makes light of an unfortunate situation for the user.

### Best Practices

* Communicate the error type clearly with appropriate use of visuals
* Always show primary navigation and footer on an error page to provide the user an option to navigate away
* Provide the immediate actions to the user to fix the problem (refresh the page, or similar)
* Do not contain error page pre-compositions inside card containers

### Examples

**404 Error**

![](https://3802052413-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MAR5Yg4q9IkTHuRlbjQ%2F-MAb6FXWly2ggQ9NQpI1%2F-MAb6ycau4XD3lJC6Knl%2F404.png?alt=media\&token=deb875e1-09ec-46a9-bf4b-e49d31cef387)

**403 Error**

![](https://3802052413-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MAR5Yg4q9IkTHuRlbjQ%2F-MAb6FXWly2ggQ9NQpI1%2F-MAb70F-52ZcMhZPikWV%2F403.png?alt=media\&token=b9f1025d-3590-4c80-ba8e-d27dd52a14a7)

**401 Error**

![](https://3802052413-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MAR5Yg4q9IkTHuRlbjQ%2F-MAb6FXWly2ggQ9NQpI1%2F-MAb73Q2CyDM8EW3UpIz%2F401.png?alt=media\&token=232543a1-3c92-405e-8ae6-72b7e25793f9)

**400 Error**

![](https://3802052413-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MAR5Yg4q9IkTHuRlbjQ%2F-MAb6FXWly2ggQ9NQpI1%2F-MAb76IOhFSLqrxOqTu7%2F400.png?alt=media\&token=7e1839d6-1248-4950-8a1b-f9f98067748c)

**500 Error**

![](https://3802052413-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MAR5Yg4q9IkTHuRlbjQ%2F-MAb6FXWly2ggQ9NQpI1%2F-MAb79COJZahebL4vkfs%2F500.png?alt=media\&token=aba8fc79-e38f-445e-b316-a6451fd56314)