diff --git a/release/background.js b/release/background.js
new file mode 100644
index 0000000..cc13c64
--- /dev/null
+++ b/release/background.js
@@ -0,0 +1,9 @@
+const background = document.querySelector("#background");
+
+const releases = document.querySelectorAll(".index li a");
+
+for (const release of releases) {
+ release.addEventListener("mouseenter", (e) => {
+ background.src = `img/${release.dataset.bg}.jpg`;
+ });
+}
diff --git a/release/img/02.jpg b/release/img/02.jpg
new file mode 100644
index 0000000..bcbc33c
Binary files /dev/null and b/release/img/02.jpg differ
diff --git a/release/img/03.jpg b/release/img/03.jpg
new file mode 100644
index 0000000..3f79a60
Binary files /dev/null and b/release/img/03.jpg differ
diff --git a/release/img/04.jpg b/release/img/04.jpg
new file mode 100644
index 0000000..044ebcd
Binary files /dev/null and b/release/img/04.jpg differ
diff --git a/release/img/05.jpg b/release/img/05.jpg
new file mode 100644
index 0000000..3611003
Binary files /dev/null and b/release/img/05.jpg differ
diff --git a/release/img/06.jpg b/release/img/06.jpg
new file mode 100644
index 0000000..e8e2b1a
Binary files /dev/null and b/release/img/06.jpg differ
diff --git a/release/img/07.jpg b/release/img/07.jpg
new file mode 100644
index 0000000..7572efe
Binary files /dev/null and b/release/img/07.jpg differ
diff --git a/release/img/all.jpg b/release/img/all.jpg
new file mode 100644
index 0000000..326b439
Binary files /dev/null and b/release/img/all.jpg differ
diff --git a/release/index.html b/release/index.html
new file mode 100644
index 0000000..ae52271
--- /dev/null
+++ b/release/index.html
@@ -0,0 +1,41 @@
+
+
+
+
+
+
+ SI18
+
+
+
+
+ 
+
+
+
diff --git a/release/style.css b/release/style.css
new file mode 100644
index 0000000..dee443d
--- /dev/null
+++ b/release/style.css
@@ -0,0 +1,72 @@
+* {
+ box-sizing: border-box;
+}
+
+html,
+body {
+ background-color: #006dfe;
+}
+
+.index {
+ width: 100%;
+ height: 100vh;
+ padding: 0 24px;
+ margin: 0;
+
+ display: flex;
+ justify-content: center;
+ align-content: center;
+
+ flex-wrap: wrap;
+ gap: 12px;
+
+ list-style: none;
+}
+
+ul {
+ padding: 0;
+ margin: 0;
+}
+
+.index li {
+ position: relative;
+ padding: 6px 12px;
+ background-color: white;
+ border-radius: 24px;
+ margin: 0;
+}
+
+a {
+ color: currentColor;
+ text-decoration: none;
+}
+
+.index a:after {
+ content: "";
+ position: absolute;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+}
+
+li:hover {
+ transform: scale(1.05);
+}
+
+#background {
+ position: absolute;
+ width: 100%;
+ height: 100vh;
+ top: 0;
+ left: 0;
+
+ object-fit: cover;
+}
+
+@media (max-width: 767.98px) {
+ #background {
+ object-fit: contain;
+ object-position: top;
+ }
+}