How to Create a Custom 404 Page in Webflow

In this tutorial, Sandro, cofounder of the Gemeos Webflow agency, shows you how to create a custom 404 page in Webflow.

1. Go to the Webflow 404 page

In the Pages panel, scroll down to the Utility Pages section. Webflow includes a default 404 Not Found page. Click it to design it like any other page.

2. Design your 404 page

Replace the default content with your custom design. Recommended elements: a friendly error message ("Oops, this page doesn't exist"), a link to the homepage, a search bar, and links to your key pages (services, blog, contact).

3. Add the correct 404 status code

Webflow automatically returns an HTTP 404 code for this page. Check it with a tool like httpstatus.io by testing a non-existent URL. A 200 code on a 404 page (a soft 404) hurts SEO.

Conclusion

A Webflow 404 page is designed like a standard page in Utility Pages. See also: create redirects in Webflow.