Mosaic컴포넌트 카탈로그Repository
← 카탈로그
patterns

Matrix Rain

#pattern#background#matrix#rain#japanese#dark-mode
의존성
없음 (순수 HTML/CSS/JS)
추가일
2026-06-11
출처
원본 보기 ↗
라이브 미리보기새 탭에서 열기 ↗
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>matrix-rain</title>
  <link rel="stylesheet" href="style.css">
</head>
<body>
<div class="jp-matrix">
  <span>ア</span><span>イ</span><span>ウ</span><span>エ</span><span>オ</span
  ><span>カ</span><span>キ</span><span>ク</span><span>ケ</span><span>コ</span
  ><span>サ</span><span>シ</span><span>ス</span><span>セ</span><span>ソ</span
  ><span>タ</span><span>チ</span><span>ツ</span><span>テ</span><span>ト</span
  ><span>ナ</span><span>ニ</span><span>ヌ</span><span>ネ</span><span>ノ</span
  ><span>ハ</span><span>ヒ</span><span>フ</span><span>ヘ</span><span>ホ</span
  ><span>マ</span><span>ミ</span><span>ム</span><span>メ</span><span>モ</span
  ><span>ヤ</span><span>ユ</span><span>ヨ</span><span>ラ</span><span>リ</span
  ><span>ル</span><span>レ</span><span>ロ</span><span>ワ</span><span>ヲ</span
  ><span>ン</span><span>ガ</span><span>ギ</span><span>グ</span><span>ゲ</span
  ><span>ゴ</span><span>ザ</span><span>ジ</span><span>ズ</span><span>ゼ</span
  ><span>ゾ</span><span>ダ</span><span>ヂ</span><span>ヅ</span><span>デ</span
  ><span>ド</span><span>バ</span><span>ビ</span><span>ブ</span><span>ベ</span
  ><span>ボ</span><span>パ</span><span>ピ</span><span>プ</span><span>ペ</span
  ><span>ポ</span><span>ア</span><span>イ</span><span>ウ</span><span>エ</span
  ><span>オ</span><span>カ</span><span>キ</span><span>ク</span><span>ケ</span
  ><span>コ</span><span>サ</span><span>シ</span><span>ス</span><span>セ</span
  ><span>ソ</span><span>タ</span><span>チ</span><span>ツ</span><span>テ</span
  ><span>ト</span><span>ナ</span><span>ニ</span><span>ヌ</span><span>ネ</span
  ><span>ノ</span><span>ハ</span><span>ヒ</span><span>フ</span><span>ヘ</span
  ><span>ホ</span> <span>ア</span><span>イ</span><span>ウ</span><span>エ</span
  ><span>オ</span><span>カ</span><span>キ</span><span>ク</span><span>ケ</span
  ><span>コ</span><span>サ</span><span>シ</span><span>ス</span><span>セ</span
  ><span>ソ</span><span>タ</span><span>チ</span><span>ツ</span><span>テ</span
  ><span>ト</span><span>ナ</span><span>ニ</span><span>ヌ</span><span>ネ</span
  ><span>ノ</span><span>ハ</span><span>ヒ</span><span>フ</span><span>ヘ</span
  ><span>ホ</span><span>マ</span><span>ミ</span><span>ム</span><span>メ</span
  ><span>モ</span><span>ヤ</span><span>ユ</span><span>ヨ</span><span>ラ</span
  ><span>リ</span><span>ル</span><span>レ</span><span>ロ</span><span>ワ</span
  ><span>ヲ</span><span>ン</span><span>ガ</span><span>ギ</span><span>グ</span
  ><span>ゲ</span><span>ゴ</span><span>ザ</span><span>ジ</span><span>ズ</span
  ><span>ゼ</span><span>ゾ</span><span>ダ</span><span>ヂ</span><span>ヅ</span
  ><span>デ</span><span>ド</span><span>バ</span><span>ビ</span><span>ブ</span
  ><span>ベ</span><span>ボ</span><span>パ</span><span>ピ</span><span>プ</span
  ><span>ペ</span><span>ポ</span><span>ア</span><span>イ</span><span>ウ</span
  ><span>エ</span><span>オ</span><span>カ</span><span>キ</span><span>ク</span
  ><span>ケ</span><span>コ</span><span>サ</span><span>シ</span><span>ス</span
  ><span>セ</span><span>ソ</span><span>タ</span><span>チ</span><span>ツ</span
  ><span>テ</span><span>ト</span><span>ナ</span><span>ニ</span><span>ヌ</span
  ><span>ネ</span><span>ノ</span><span>ハ</span><span>ヒ</span><span>フ</span
  ><span>ヘ</span><span>ホ</span> <span>ア</span><span>イ</span><span>ウ</span
  ><span>エ</span><span>オ</span><span>カ</span><span>キ</span><span>ク</span
  ><span>ケ</span><span>コ</span><span>サ</span><span>シ</span><span>ス</span
  ><span>セ</span><span>ソ</span><span>タ</span><span>チ</span><span>ツ</span
  ><span>テ</span><span>ト</span><span>ナ</span><span>ニ</span><span>ヌ</span
  ><span>ネ</span><span>ノ</span><span>ハ</span><span>ヒ</span><span>フ</span
  ><span>ヘ</span><span>ホ</span><span>マ</span><span>ミ</span><span>ム</span
  ><span>メ</span><span>モ</span><span>ヤ</span><span>ユ</span><span>ヨ</span
  ><span>ラ</span><span>リ</span><span>ル</span><span>レ</span><span>ロ</span
  ><span>ワ</span><span>ヲ</span><span>ン</span><span>ガ</span><span>ギ</span
  ><span>グ</span><span>ゲ</span><span>ゴ</span><span>ザ</span><span>ジ</span
  ><span>ズ</span><span>ゼ</span><span>ゾ</span><span>ダ</span><span>ヂ</span
  ><span>ヅ</span><span>デ</span><span>ド</span><span>バ</span><span>ビ</span
  ><span>ブ</span><span>ベ</span><span>ボ</span><span>パ</span><span>ピ</span
  ><span>プ</span><span>ペ</span><span>ポ</span><span>ア</span><span>イ</span
  ><span>ウ</span><span>エ</span><span>オ</span><span>カ</span><span>キ</span
  ><span>ク</span><span>ケ</span><span>コ</span><span>サ</span><span>シ</span
  ><span>ス</span><span>セ</span><span>ソ</span><span>タ</span><span>チ</span
  ><span>ツ</span><span>テ</span><span>ト</span><span>ナ</span><span>ニ</span
  ><span>ヌ</span><span>ネ</span><span>ノ</span><span>ハ</span><span>ヒ</span
  ><span>フ</span><span>ヘ</span><span>ホ</span> <span>ア</span><span>イ</span
  ><span>ウ</span><span>エ</span><span>オ</span><span>カ</span><span>キ</span
  ><span>ク</span><span>ケ</span><span>コ</span><span>サ</span><span>シ</span
  ><span>ス</span><span>セ</span><span>ソ</span><span>タ</span><span>チ</span
  ><span>ツ</span><span>テ</span><span>ト</span><span>ナ</span><span>ニ</span
  ><span>ヌ</span><span>ネ</span><span>ノ</span><span>ハ</span><span>ヒ</span
  ><span>フ</span><span>ヘ</span><span>ホ</span><span>マ</span><span>ミ</span
  ><span>ム</span><span>メ</span><span>モ</span><span>ヤ</span><span>ユ</span
  ><span>ヨ</span><span>ラ</span><span>リ</span><span>ル</span><span>レ</span
  ><span>ロ</span><span>ワ</span><span>ヲ</span><span>ン</span><span>ガ</span
  ><span>ギ</span><span>グ</span><span>ゲ</span><span>ゴ</span><span>ザ</span
  ><span>ジ</span><span>ズ</span><span>ゼ</span><span>ゾ</span><span>ダ</span
  ><span>ヂ</span><span>ヅ</span><span>デ</span><span>ド</span><span>バ</span
  ><span>ビ</span><span>ブ</span><span>ベ</span><span>ボ</span><span>パ</span
  ><span>ピ</span><span>プ</span><span>ペ</span><span>ポ</span><span>ア</span
  ><span>イ</span><span>ウ</span><span>エ</span><span>オ</span><span>カ</span
  ><span>キ</span><span>ク</span><span>ケ</span><span>コ</span><span>サ</span
  ><span>シ</span><span>ス</span><span>セ</span><span>ソ</span><span>タ</span
  ><span>チ</span><span>ツ</span><span>テ</span><span>ト</span><span>ナ</span
  ><span>ニ</span><span>ヌ</span><span>ネ</span><span>ノ</span><span>ハ</span
  ><span>ヒ</span><span>フ</span><span>ヘ</span><span>ホ</span> <span>ア</span
  ><span>イ</span><span>ウ</span><span>エ</span><span>オ</span><span>カ</span
  ><span>キ</span><span>ク</span><span>ケ</span><span>コ</span><span>サ</span
  ><span>シ</span><span>ス</span><span>セ</span><span>ソ</span><span>タ</span
  ><span>チ</span><span>ツ</span><span>テ</span><span>ト</span><span>ナ</span
  ><span>ニ</span><span>ヌ</span><span>ネ</span><span>ノ</span><span>ハ</span
  ><span>ヒ</span><span>フ</span><span>ヘ</span><span>ホ</span><span>マ</span
  ><span>ミ</span><span>ム</span><span>メ</span><span>モ</span><span>ヤ</span
  ><span>ユ</span><span>ヨ</span><span>ラ</span><span>リ</span><span>ル</span
  ><span>レ</span><span>ロ</span><span>ワ</span><span>ヲ</span><span>ン</span
  ><span>ガ</span><span>ギ</span><span>グ</span><span>ゲ</span><span>ゴ</span
  ><span>ザ</span><span>ジ</span><span>ズ</span><span>ゼ</span><span>ゾ</span
  ><span>ダ</span><span>ヂ</span><span>ヅ</span><span>デ</span><span>ド</span
  ><span>バ</span><span>ビ</span><span>ブ</span><span>ベ</span><span>ボ</span
  ><span>パ</span><span>ピ</span><span>プ</span><span>ペ</span><span>ポ</span
  ><span>ア</span><span>イ</span><span>ウ</span><span>エ</span><span>オ</span
  ><span>カ</span><span>キ</span><span>ク</span><span>ケ</span><span>コ</span
  ><span>サ</span><span>シ</span><span>ス</span><span>セ</span><span>ソ</span
  ><span>タ</span><span>チ</span><span>ツ</span><span>テ</span><span>ト</span
  ><span>ナ</span><span>ニ</span><span>ヌ</span><span>ネ</span><span>ノ</span
  ><span>ハ</span><span>ヒ</span><span>フ</span><span>ヘ</span><span>ホ</span>
  <span>ア</span><span>イ</span><span>ウ</span><span>エ</span><span>オ</span
  ><span>カ</span><span>キ</span><span>ク</span><span>ケ</span><span>コ</span
  ><span>サ</span><span>シ</span><span>ス</span><span>セ</span><span>ソ</span
  ><span>タ</span><span>チ</span><span>ツ</span><span>テ</span><span>ト</span
  ><span>ナ</span><span>ニ</span><span>ヌ</span><span>ネ</span><span>ノ</span
  ><span>ハ</span><span>ヒ</span><span>フ</span><span>ヘ</span><span>ホ</span
  ><span>マ</span><span>ミ</span><span>ム</span><span>メ</span><span>モ</span
  ><span>ヤ</span><span>ユ</span><span>ヨ</span><span>ラ</span><span>リ</span
  ><span>ル</span><span>レ</span><span>ロ</span><span>ワ</span><span>ヲ</span
  ><span>ン</span><span>ガ</span><span>ギ</span><span>グ</span><span>ゲ</span
  ><span>ゴ</span><span>ザ</span><span>ジ</span><span>ズ</span><span>ゼ</span
  ><span>ゾ</span><span>ダ</span><span>ヂ</span><span>ヅ</span><span>デ</span
  ><span>ド</span><span>バ</span><span>ビ</span><span>ブ</span><span>ベ</span
  ><span>ボ</span><span>パ</span><span>ピ</span><span>プ</span><span>ペ</span
  ><span>ポ</span><span>ア</span><span>イ</span><span>ウ</span><span>エ</span
  ><span>オ</span><span>カ</span><span>キ</span><span>ク</span><span>ケ</span
  ><span>コ</span><span>サ</span><span>シ</span><span>ス</span><span>セ</span
  ><span>ソ</span><span>タ</span><span>チ</span><span>ツ</span><span>テ</span
  ><span>ト</span><span>ナ</span><span>ニ</span><span>ヌ</span><span>ネ</span
  ><span>ノ</span><span>ハ</span><span>ヒ</span><span>フ</span><span>ヘ</span
  ><span>ホ</span> <span>ア</span><span>イ</span><span>ウ</span><span>エ</span
  ><span>オ</span><span>カ</span><span>キ</span><span>ク</span><span>ケ</span
  ><span>コ</span><span>サ</span><span>シ</span><span>ス</span><span>セ</span
  ><span>ソ</span><span>タ</span><span>チ</span><span>ツ</span><span>テ</span
  ><span>ト</span><span>ナ</span><span>ニ</span><span>ヌ</span><span>ネ</span
  ><span>ノ</span><span>ハ</span><span>ヒ</span><span>フ</span><span>ヘ</span
  ><span>ホ</span><span>マ</span><span>ミ</span><span>ム</span><span>メ</span
  ><span>モ</span><span>ヤ</span><span>ユ</span><span>ヨ</span><span>ラ</span
  ><span>リ</span><span>ル</span><span>レ</span><span>ロ</span><span>ワ</span
  ><span>ヲ</span><span>ン</span><span>ガ</span><span>ギ</span><span>グ</span
  ><span>ゲ</span><span>ゴ</span><span>ザ</span><span>ジ</span><span>ズ</span
  ><span>ゼ</span><span>ゾ</span><span>ダ</span><span>ヂ</span><span>ヅ</span
  ><span>デ</span><span>ド</span><span>バ</span><span>ビ</span><span>ブ</span
  ><span>ベ</span><span>ボ</span><span>パ</span><span>ピ</span><span>プ</span
  ><span>ペ</span><span>ポ</span><span>ア</span><span>イ</span><span>ウ</span
  ><span>エ</span><span>オ</span><span>カ</span><span>キ</span><span>ク</span
  ><span>ケ</span><span>コ</span><span>サ</span><span>シ</span><span>ス</span
  ><span>セ</span><span>ソ</span><span>タ</span><span>チ</span><span>ツ</span
  ><span>テ</span><span>ト</span><span>ナ</span><span>ニ</span><span>ヌ</span
  ><span>ネ</span><span>ノ</span><span>ハ</span><span>ヒ</span><span>フ</span
  ><span>ヘ</span><span>ホ</span> <span>ア</span><span>イ</span><span>ウ</span
  ><span>エ</span><span>オ</span><span>カ</span><span>キ</span><span>ク</span
  ><span>ケ</span><span>コ</span><span>サ</span><span>シ</span><span>ス</span
  ><span>セ</span><span>ソ</span><span>タ</span><span>チ</span><span>ツ</span
  ><span>テ</span><span>ト</span><span>ナ</span><span>ニ</span><span>ヌ</span
  ><span>ネ</span><span>ノ</span><span>ハ</span><span>ヒ</span><span>フ</span
  ><span>ヘ</span><span>ホ</span><span>マ</span><span>ミ</span><span>ム</span
  ><span>メ</span><span>モ</span><span>ヤ</span><span>ユ</span><span>ヨ</span
  ><span>ラ</span><span>リ</span><span>ル</span><span>レ</span><span>ロ</span
  ><span>ワ</span><span>ヲ</span><span>ン</span><span>ガ</span><span>ギ</span
  ><span>グ</span><span>ゲ</span><span>ゴ</span><span>ザ</span><span>ジ</span
  ><span>ズ</span><span>ゼ</span><span>ゾ</span><span>ダ</span><span>ヂ</span
  ><span>ヅ</span><span>デ</span><span>ド</span><span>バ</span><span>ビ</span
  ><span>ブ</span><span>ベ</span><span>ボ</span><span>パ</span><span>ピ</span
  ><span>プ</span><span>ペ</span><span>ポ</span><span>ア</span><span>イ</span
  ><span>ウ</span><span>エ</span><span>オ</span><span>カ</span><span>キ</span
  ><span>ク</span><span>ケ</span><span>コ</span><span>サ</span><span>シ</span
  ><span>ス</span><span>セ</span><span>ソ</span><span>タ</span><span>チ</span
  ><span>ツ</span><span>テ</span><span>ト</span><span>ナ</span><span>ニ</span
  ><span>ヌ</span><span>ネ</span><span>ノ</span><span>ハ</span><span>ヒ</span
  ><span>フ</span><span>ヘ</span><span>ホ</span> <span>ア</span><span>イ</span
  ><span>ウ</span><span>エ</span><span>オ</span><span>カ</span><span>キ</span
  ><span>ク</span><span>ケ</span><span>コ</span><span>サ</span><span>シ</span
  ><span>ス</span><span>セ</span><span>ソ</span><span>タ</span><span>チ</span
  ><span>ツ</span><span>テ</span><span>ト</span><span>ナ</span><span>ニ</span
  ><span>ヌ</span><span>ネ</span><span>ノ</span><span>ハ</span><span>ヒ</span
  ><span>フ</span><span>ヘ</span><span>ホ</span><span>マ</span><span>ミ</span
  ><span>ム</span><span>メ</span><span>モ</span><span>ヤ</span><span>ユ</span
  ><span>ヨ</span><span>ラ</span><span>リ</span><span>ル</span><span>レ</span
  ><span>ロ</span><span>ワ</span><span>ヲ</span><span>ン</span><span>ガ</span
  ><span>ギ</span><span>グ</span><span>ゲ</span><span>ゴ</span><span>ザ</span
  ><span>ジ</span><span>ズ</span><span>ゼ</span><span>ゾ</span><span>ダ</span
  ><span>ヂ</span><span>ヅ</span><span>デ</span><span>ド</span><span>バ</span
  ><span>ビ</span><span>ブ</span><span>ベ</span><span>ボ</span><span>パ</span
  ><span>ピ</span><span>プ</span><span>ペ</span><span>ポ</span><span>ア</span
  ><span>イ</span><span>ウ</span><span>エ</span><span>オ</span><span>カ</span
  ><span>キ</span><span>ク</span><span>ケ</span><span>コ</span><span>サ</span
  ><span>シ</span><span>ス</span><span>セ</span><span>ソ</span><span>タ</span
  ><span>チ</span><span>ツ</span><span>テ</span><span>ト</span><span>ナ</span
  ><span>ニ</span><span>ヌ</span><span>ネ</span><span>ノ</span><span>ハ</span
  ><span>ヒ</span><span>フ</span><span>ヘ</span><span>ホ</span> <span>ア</span
  ><span>イ</span><span>ウ</span><span>エ</span><span>オ</span><span>カ</span
  ><span>キ</span><span>ク</span><span>ケ</span><span>コ</span><span>サ</span
  ><span>シ</span><span>ス</span><span>セ</span><span>ソ</span><span>タ</span
  ><span>チ</span><span>ツ</span><span>テ</span><span>ト</span><span>ナ</span
  ><span>ニ</span><span>ヌ</span><span>ネ</span><span>ノ</span><span>ハ</span
  ><span>ヒ</span><span>フ</span><span>ヘ</span><span>ホ</span><span>マ</span
  ><span>ミ</span><span>ム</span><span>メ</span><span>モ</span><span>ヤ</span
  ><span>ユ</span><span>ヨ</span><span>ラ</span><span>リ</span><span>ル</span
  ><span>レ</span><span>ロ</span><span>ワ</span><span>ヲ</span><span>ン</span
  ><span>ガ</span><span>ギ</span><span>グ</span><span>ゲ</span><span>ゴ</span
  ><span>ザ</span><span>ジ</span><span>ズ</span><span>ゼ</span><span>ゾ</span
  ><span>ダ</span><span>ヂ</span><span>ヅ</span><span>デ</span><span>ド</span
  ><span>バ</span><span>ビ</span><span>ブ</span><span>ベ</span><span>ボ</span
  ><span>パ</span><span>ピ</span><span>プ</span><span>ペ</span><span>ポ</span
  ><span>ア</span><span>イ</span><span>ウ</span><span>エ</span><span>オ</span
  ><span>カ</span><span>キ</span><span>ク</span><span>ケ</span><span>コ</span
  ><span>サ</span><span>シ</span><span>ス</span><span>セ</span><span>ソ</span
  ><span>タ</span><span>チ</span><span>ツ</span><span>テ</span><span>ト</span
  ><span>ナ</span><span>ニ</span><span>ヌ</span><span>ネ</span><span>ノ</span
  ><span>ハ</span><span>ヒ</span><span>フ</span><span>ヘ</span><span>ホ</span>
  <span>ア</span><span>イ</span><span>ウ</span><span>エ</span><span>オ</span
  ><span>カ</span><span>キ</span><span>ク</span><span>ケ</span><span>コ</span
  ><span>サ</span><span>シ</span><span>ス</span><span>セ</span><span>ソ</span
  ><span>タ</span><span>チ</span><span>ツ</span><span>テ</span><span>ト</span
  ><span>ナ</span><span>ニ</span><span>ヌ</span><span>ネ</span><span>ノ</span
  ><span>ハ</span><span>ヒ</span><span>フ</span><span>ヘ</span><span>ホ</span
  ><span>マ</span><span>ミ</span><span>ム</span><span>メ</span><span>モ</span
  ><span>ヤ</span><span>ユ</span><span>ヨ</span><span>ラ</span><span>リ</span
  ><span>ル</span><span>レ</span><span>ロ</span><span>ワ</span><span>ヲ</span
  ><span>ン</span><span>ガ</span><span>ギ</span><span>グ</span><span>ゲ</span
  ><span>ゴ</span><span>ザ</span><span>ジ</span><span>ズ</span><span>ゼ</span
  ><span>ゾ</span><span>ダ</span><span>ヂ</span><span>ヅ</span><span>デ</span
  ><span>ド</span><span>バ</span><span>ビ</span><span>ブ</span><span>ベ</span
  ><span>ボ</span><span>パ</span><span>ピ</span><span>プ</span><span>ペ</span
  ><span>ポ</span><span>ア</span><span>イ</span><span>ウ</span><span>エ</span
  ><span>オ</span><span>カ</span><span>キ</span><span>ク</span><span>ケ</span
  ><span>コ</span><span>サ</span><span>シ</span><span>ス</span><span>セ</span
  ><span>ソ</span><span>タ</span><span>チ</span><span>ツ</span><span>テ</span
  ><span>ト</span><span>ナ</span><span>ニ</span><span>ヌ</span><span>ネ</span
  ><span>ノ</span><span>ハ</span><span>ヒ</span><span>フ</span><span>ヘ</span
  ><span>ホ</span>
</div>

</body>
</html>