Brand the 404 Page
Updated over a week ago

If you don't have any specific requirements for your 404 page, you can use Uscreen's default page without any additional steps.

To brand your 404 page, you can add the following code with your modifications to the Head Code section of the Code Snippets.

This 404 page will display your site's logo by default and will be presented for any 404 page on your site. If you wish to further customize this and aren't familiar with basic HTML/CSS, you'll need to hire a developer.

Customization Code

Copy the following code into the Head Code section of your code snippets.

let detect404Page = () => {
let notFoundContainer = document.querySelector('.not-found')
if (notFoundContainer) {
if (!notFoundContainer.classList.value.includes('touched')) {
let markup = 'ADD YOUR OWN TEXT HERE'
let description = document.querySelector('.not-found .description')
description.innerText = ''
description.insertAdjacentHTML('afterbegin', markup)
setTimeout(() => detect404Page(), 500)
.not-found {
margin-top: 13vw !important;
.not-found .brand-logo {
max-height: 150px;
.not-found .error-image {
display: none;
.not-found .title-area,
.not-found .description {
font-size: 0;
.not-found.touched .description {
font-size: 20px;
text-align: center;
max-width: 800px;
body > div.relative.z-100 > div.not-found.touched > div{
.not-found .description {
margin-top: 10px;
.not-found .title-area:before {
font-size: 35px;

Please be advised that our support team is not equipped to provide assistance with custom coding. If you require guidance on implementation or utilizing the code beyond its current state, we recommend seeking the assistance of a skilled developer.

Did this answer your question?