404-matrix-rain-katakana-classic/index.html at main · notfoundpages/404-matrix-rain-katakana-classic · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
<!--
© 2026 Not Found Pages · 404-matrix-rain-katakana-classic
Released under the MIT License

Repository → https://github.com/notfoundpages/404-matrix-rain-katakana-classic
Live Preview → https://notfoundpages.github.io/404-matrix-rain-katakana-classic

Discover the full collection → https://notfoundpages.github.io
-->

<!DOCTYPE html>
<html lang="en">

<head>

  <!-- Character Encoding & Viewport -->
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">

  <!-- Primary Meta Tags -->
  <title>404-matrix-rain-katakana-classic • notfoundpages</title>
  <meta name="title" content="404-matrix-rain-katakana-classic ~ notfoundpages">
  <meta name="description"
    content="A classic Matrix-inspired 404 error page featuring cascading Katakana characters, glowing green digital rain, and a sleek terminal-style interface. Built with pure HTML, CSS & JavaScript, it's lightweight, responsive, and perfect for adding a cyberpunk touch to modern websites.">
  <meta name="keywords"
    content="404 page, Matrix, Matrix rain, Katakana, error page, 404 error, cyberpunk, digital rain, HTML, CSS, JavaScript, responsive web design, notfoundpages, Not Found Pages, NOT FOUND PAGES, NotFoundPages, creative 404 pages, interactive error page, terminal design, hacker aesthetic, green screen, Japanese characters">
  <meta name="author" content="Not Found Pages">
  <meta name="robots" content="index, follow">
  <meta name="language" content="English">

  <!-- Open Graph / Facebook Meta Tags -->
  <meta property="og:type" content="website">
  <meta property="og:url" content="https://notfoundpages.github.io/404-matrix-rain-katakana-classic/">
  <meta property="og:title" content="404-matrix-rain-katakana-classic • notfoundpages">
  <meta property="og:description"
    content="A classic Matrix-inspired 404 error page featuring cascading Katakana characters, glowing green digital rain, and a sleek terminal-style interface. Built with pure HTML, CSS & JavaScript.">
  <meta property="og:image"
    content="https://notfoundpages.github.io/404-matrix-rain-katakana-classic/assets/previews/open-graph.png">
  <meta property="og:site_name" content="Not Found Pages">

  <!-- Twitter Meta Tags -->
  <meta name="twitter:card" content="summary_large_image">
  <meta name="twitter:url" content="https://notfoundpages.github.io/404-matrix-rain-katakana-classic/">
  <meta name="twitter:title" content="404-matrix-rain-katakana-classic • notfoundpages">
  <meta name="twitter:description"
    content="A classic Matrix-inspired 404 error page featuring cascading Katakana characters, glowing green digital rain, and a sleek terminal-style interface. Built with pure HTML, CSS & JavaScript.">
  <meta name="twitter:image"
    content="https://notfoundpages.github.io/404-matrix-rain-katakana-classic/assets/previews/open-graph.png">

  <!-- Canonical URL -->
  <link rel="canonical" href="https://notfoundpages.github.io/404-matrix-rain-katakana-classic/">

  <!-- Structured Data (JSON-LD) -->
  <script type="application/ld+json">
  {
    "@context": "https://schema.org",
    "@type": "WebPage",
    "name": "404-matrix-rain-katakana-classic",
    "description": "A classic Matrix-inspired 404 error page featuring cascading Katakana characters, glowing green digital rain, and a sleek terminal-style interface. Built with pure HTML, CSS & JavaScript.",
    "url": "https://notfoundpages.github.io/404-matrix-rain-katakana-classic/",
    "creator": {
      "@type": "Organization",
      "name": "Not Found Pages",
      "url": "https://github.com/notfoundpages"
    },
    "isPartOf": {
      "@type": "WebSite",
      "name": "Not Found Pages",
      "url": "https://notfoundpages.github.io/"
    }
  }
  </script>

  <!-- Stylesheets -->
  <link rel="preconnect" href="https://fonts.googleapis.com">
  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
  <link href="https://fonts.googleapis.com/css2?family=Share+Tech+Mono&display=swap" rel="stylesheet">
  <link rel="stylesheet" href="style.css">

</head>

<body>
  <canvas id="matrix"></canvas>

  <div class="container">
    <div class="msg">
      <h1>404</h1>
      <p>System Error<br>Page Not Found</p>
      <button id="backBtn" class="back-btn" type="button" aria-label="Go back">Initialize Return</button>
    </div>
  </div>

  <script src="script.js"></script>
</body>

</html>