Glass && Sunset

glass/glass.css

@@ -0,0 +1,7 @@
+.glass {
+	background: rgba(128, 128, 128, 0.35);
+	box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
+	border-radius: 3em;
+	padding: 1em 2em;
+        backdrop-filter: blur(2px);
+}

glass/glass.html

@@ -0,0 +1,7 @@
+<link rel="stylesheet" href="glass.css">
+<div class=glass style="position: absolute;">
+  <p>demo txt</p>
+</div>
+<p> Under Demo Under Demo Under Demo Under Demo</p>
+<p>Under Demo Under Demo Under Demo</p>
+<p>Under Demo Under Demo Under Demo Under Demo Under Demo</p>

sunset/sunset.css

@@ -0,0 +1,30 @@
+:root{
+    --ColorA: pink;
+    --ColorB: purple;
+}
+
+.sunset {
+	background: linear-gradient(45deg, var(--ColorA) 2%, var(--ColorB));
+	margin: 0px;
+	animation: gradient 35s linear infinite;
+	background-size: 180% 180%;
+	height: 100vh;
+	width: 100vw;
+	position: fixed;
+	z-index: -1;
+	top:0;
+	left:0;
+}
+
+@keyframes gradient {
+	0% {
+		background-position: 0% 50%;
+	}
+
+	50% {
+		background-position: 100% 50%;
+	}
+
+	100% {
+		background-position: 0% 50%;
+	}

sunset/sunset.html

@@ -0,0 +1,3 @@
+<link rel="stylesheet" href="sunset.css">
+<div class=sunset></div>
+<p>demo txt</p>