Chrome-like error page

Developer
Andrea Verlicchi
Size
2,484 Kb
Views
26,312
  1. Chrome-like error page Previews
  2. Chrome-like error page HTML Codes
  3. Chrome-like error page CSS Codes

How do I make an chrome-like error page?

This page emulates the Chrome error page. What is a chrome-like error page? How do you make a chrome-like error page? This script and codes were developed by Andrea Verlicchi on 08 September 2022, Thursday.

Chrome-like error page Previews
IQ Test

Chrome-like error page - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>Chrome-like error page</title> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/meyer-reset/2.0/reset.min.css"> <link rel="stylesheet" href="css/style.css">
</head>
<body> <div class="container"> <div class="icon"></div> <h1>A resource that is needed to complete your request is unavailable</h1> <p>Please refresh your browser.</p>
</div> <script src='http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script>
</body>
</html>

Chrome-like error page - Script Codes CSS Codes

body { margin: 1em; background: #f7f7f7;
}
.container { line-height: 1.7em; box-sizing: border-box; color: #585858; display: block; font-family: 'Segoe UI', Tahoma, sans-serif; margin: 100px auto 0; max-width: 700px;
}
h1 { font-size: 24px; margin-bottom: 1em;
}
p { font-size: 18px;
}
.icon { height: 50px; width: 41px; margin: 40px 0; background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACkAAAAyCAAAAADkGq1yAAAAAnRSTlMA/1uRIrUAAABLSURBVHhe7dOxDQAgCERRdrza/ScwscNYSKIhWAror9+VR7BjKZbkrSpKeA45K8PQuoYqcUNKbmUzpNkD8kvM/ErlkVFk8necCyU7IotT35DVJRIAAAAASUVORK5CYII=");
}
Chrome-like error page - Script Codes
Chrome-like error page - Script Codes
Home Page Home
Developer Andrea Verlicchi
Username verlok
Uploaded September 08, 2022
Rating 3
Size 2,484 Kb
Views 26,312
Do you need developer help for Chrome-like error page?

Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!

Andrea Verlicchi (verlok) Script Codes
Name
A Pen by Andrea Verlicchi
CSS only spinner loading animation
Hiding images without the src attribute
URL-encoded SVG as background image
Flex row wrap grow but not the last line
CSS 3 only Smoke animation
Circle of dots loading animation - CSS only
CSS vars based layout spacing
4 modes to center a box using CSS
The Excercist
Create amazing captions with AI!

Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!