html
html
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
<!--This is an another version of space having single orbit, shooting star (Meteors)🌠, Saturn🪐-->
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
<div class="wrapper">
<div class="saturn">
</div>
<div class="container"></div>
<div class="ring"></div>
</div>
<div class="kim"></div>
<div class="star1"></div>
<div class="star2"></div>
<div class="star3"></div>
<div class="star4"></div>
<div class="star5"></div>
<div class="planet"></div>
<div class="beam-1 beams"></div>
<div class="beam-2 beams"></div>
<div class="shooting"></div>
<div class="shooting2"></div>
<div class="yep one"></div>
</body>
</html>
Enter to Rename, Shift+Enter to Preview
css
css
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
body {
display:flex;
margin:0;
height:80vh;
background: radial-gradient(ellipse at bottom, #1b2735 0%, #090a0f 100%);
font-size: 30px;
margin-top:5em;
margin-left:6em;
}
.saturn {
position:fixed;
margin-top:4em;
margin-left:-1em;
width:5.5em;
height:5.5em;
border-radius:100%;
background: linear-gradient(to bottom right, #ffd857, #d64fff, #8059ff, #54ffff);
box-shadow:0 0 15px #d64fff, 0 0 9px #009dff;
border:1px solid purple;
animation: spin 6s infinite linear;
}
@keyframes spin {
100% {
transform: rotate(360deg);
}
}
}
.container{
Enter to Rename, Shift+Enter to Preview
js
js
1
alert("This is an another version of space having single orbit, shooting star (Meteors)🌠, Saturn🪐")
Enter to Rename, Shift+Enter to Preview
BROWSER
Console
Run