diff --git a/main.go b/main.go
index 202fb2a..4e85fe1 100644
--- a/main.go
+++ b/main.go
@@ -99,7 +99,7 @@ func mainHandler(w http.ResponseWriter, r *http.Request) {
 				return
 			}
 		case "/raw":
-			fmt.Fprintf(w, "%s\n%s\n", netAddr.Address, netAddr.Type)
+			fmt.Fprintf(w, "%s\n", netAddr.Address)
 		case "/json":
 			responseJSON(w, netAddr)
 		default:
diff --git a/templates/index.html b/templates/index.html
index ab25390..d4070cc 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -4,10 +4,50 @@
 		<title>My IP</title>
 		<meta charset="UTF-8">
 		<meta name="viewport" content="width=device-width, initial-scale=1">
+		<style>
+			body {
+				font-family: Arial, sans-serif;
+				font-size: 5rem;
+				color: #333;
+				display: flex;
+				justify-content: center;
+				align-items: center;
+				height: 100vh;
+				margin: 0;
+			}
+			ul {
+				list-style: none;
+				padding: 0;
+				margin: 0;
+				background: #fff;
+				border-radius: 8px;
+				overflow: hidden;
+			}
+			li {
+				padding: 15px 20px;
+				border-bottom: 1px solid #ddd;
+			}
+			li:last-child {
+				border-bottom: none;
+			}
+			.noselect {
+				-webkit-user-select: none;
+				-moz-user-select: none;
+				-ms-user-select: none;
+				user-select: none;
+				color: #555;
+			}
+			b {
+				color: #000;
+			}
+		</style>
 	</head>
 	<body>
-		IP: {{ .Address }}<br />
-		IP: {{ .Type}}<br />
+		<ul id="ips">
+			<li>
+				<span class="noselect">{{ .Type }}: </span><b>{{ .Address }}</b>
+			</li>
+		</ul>
 	</body>
 	<script>
 		async function getIp() {
@@ -17,6 +57,15 @@
 			const response = await fetch(requestUrl);
 			const data = await response.json();
 
+			const ul = document.getElementById("ips")
+
+			if (data.address) {
+				let child = document.createElement("li")
+				child.innerHTML = `<span class="noselect">${data.type}: </span><b>${data.address}</b>`
+
+				ul.appendChild(child)
+			}
+
 			console.log(data)
 		}
 		getIp();
