diff --git a/earth.webp b/earth.webp
new file mode 100644
index 0000000..704b776
Binary files /dev/null and b/earth.webp differ
diff --git a/index.html b/index.html
new file mode 100644
index 0000000..87ab2d2
--- /dev/null
+++ b/index.html
@@ -0,0 +1,32 @@
+
+
+
+
+
+
+ Document
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/manifest.json b/manifest.json
new file mode 100644
index 0000000..43b1791
--- /dev/null
+++ b/manifest.json
@@ -0,0 +1,17 @@
+{
+ "manifest_version": 3,
+ "name": "Cosmic Clock Tab",
+ "version": "1.0",
+ "description": "Cosmic Clock Tab is the new tab clock. New tab allows you to see an analog clock when you open it. You can use it with clock theme.The themes were inspired by galaxies and orbits.",
+ "chrome_url_overrides": {
+ "newtab": "index.html"
+ },
+ "permissions": ["storage"],
+ "icons": {
+ "16": "icons/16.jpg",
+ "32": "icons/32.jpg",
+ "48": "icons/48.jpg",
+ "128": "icons/128.jpg"
+ }
+}
+
\ No newline at end of file
diff --git a/moon.jpg b/moon.jpg
new file mode 100644
index 0000000..53ee9ca
Binary files /dev/null and b/moon.jpg differ
diff --git a/script.js b/script.js
new file mode 100644
index 0000000..6f1752b
--- /dev/null
+++ b/script.js
@@ -0,0 +1,79 @@
+
+const viewportWidth = window.innerWidth;
+const viewportHeight = window.innerHeight;
+function Update() {
+ const d = new Date();
+ min = d.getMinutes();
+ hour = d.getHours();
+ second=d.getSeconds();
+ document.getElementById('hour-time').innerText = hour;
+ document.getElementById('min-time').innerText = min < 10 ? '0' + min : min.toString();
+ const AngleMin = min * 6;
+ const AngleHr = (hour % 12) * 30 + (min / 60) * 30;
+ const AngleSec= second *6;
+ // alert(AngleSec);
+ const mi = document.getElementById('handMin');
+ const hr = document.getElementById('handHr');
+ const sec = document.getElementById('handSec');
+ sec.style.transform=`rotate(${AngleSec}deg)`;
+ mi.style.transform = `rotate(${AngleMin}deg)`;
+ hr.style.transform = `rotate(${AngleHr}deg)`;
+
+}
+setInterval(Update, 100);
+
+
+function getRandomInt(min, max) {
+ min = Math.ceil(min);
+ max = Math.floor(max);
+ return Math.floor(Math.random() * (max - min + 1)) + min;
+}
+
+function randomStar() {
+ for (let x = 0; x < 50; x++) {
+ let y = viewportHeight - getRandomInt(0, viewportHeight);
+ let x = viewportWidth - getRandomInt(0, viewportWidth);
+ let size = getRandomInt(0, 3)+'px';
+ const star = document.createElement('span');
+ star.classList.add('star');
+ document.body.appendChild(star);
+ star.style.top=y+'px';
+ star.style.left=x+'px';
+ star.style.width=size;
+ star.style.height=size;
+ star.style.opacity=getRandomInt(0.3, 1);
+ console.log(x+'px '+y+'px ')
+ }
+
+}
+randomStar();
+
+
+let isDarkTheme = false;
+
+// Add click event listener
+changeTheme.addEventListener('click', () => {
+ // Toggle between themes
+ let Sec=document.getElementById('handSec');
+ let Min=document.getElementById('handMin');
+ let Hr=document.getElementById('handHr');
+ isDarkTheme = !isDarkTheme;
+
+ if (isDarkTheme) {
+ // Apply dark theme
+ Sec.style.backgroundColor = '#1b1a55';
+ Min.style.backgroundColor = '#535c91';
+ Hr.style.backgroundColor = '#9290c3';
+ document.getElementById('time-show').style.color='white';
+ isDarkTheme=true;
+
+ } else {
+ // Apply light theme (or default theme)
+ Sec.style.backgroundColor = '';
+ Min.style.backgroundColor = '';
+ Hr.style.backgroundColor = '';
+ document.getElementById('time-show').style.color='';
+ }
+});
+
+
diff --git a/style.css b/style.css
new file mode 100644
index 0000000..7fa20c6
--- /dev/null
+++ b/style.css
@@ -0,0 +1,135 @@
+* {
+ padding: 0px;
+ margin: 0px;
+
+}
+
+body {
+ width: 100vw;
+ height: 100vh;
+ overflow: hidden;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+}
+
+.main {
+ width: 100%;
+ height: 100%;
+ background-color:#070f2b;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+}
+
+
+.second,
+.hour,
+.minute {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ position: absolute;
+ box-shadow: 0 0 10px 10px rgba(0,0,0,0.2);
+}
+
+#second-hand,#min-hand,#hour-hand{
+ width:50px;
+ height: 50px;
+ border-radius: 50%;
+ position: absolute;
+ top:-25px;
+
+}
+#second-hand{
+ background-image: url('moon.jpg');
+ background-position: center;
+ background-size: 60px;
+ box-shadow:0px 5px 13px 0px rgba(255,255,255,0.2), inset 0 10px 5px 0px rgba(0,0,0,0.6);
+
+}
+#min-hand{
+ background-image: url('earth.webp');
+ background-position: center;
+ background-size: 63px;
+ box-shadow:0px 5px 13px 0px rgba(255,255,255,0.2), inset 0 10px 10px 0px rgba(0,0,0,0.3);
+
+}
+#hour-hand{
+ background-image: url('sun1.jpg');
+ background-position: center;
+ background-size: 110px;
+ box-shadow:0px 0px 11px 0px #ffc100, inset 0 0 1px 0px #ffc100;
+
+}
+
+
+.time-show {
+ width: 20vh;
+ height: 20vh;
+ border-radius: 50%;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ flex-wrap: wrap;
+ font-size:2.5em;
+ z-index: 4;
+ color: rgba(255,255,255,0.2);
+ font-family: Impact;
+ font-weight: lighter;
+}
+
+.second {
+ width: 80vh;
+ height: 80vh;
+ border-radius: 50%;
+ z-index: 1;
+ transition: transform 1s linear ;
+ border:2px solid rgba(255,255,255,0.2);
+}
+
+
+
+#handMin {
+ width: 55vh;
+ height: 55vh;
+ border:2px solid rgba(255,255,255,0.2);
+ border-radius: 50%;
+ z-index: 2;
+ transition: transform 1s linear ;
+}
+
+#handHr {
+ width: 30vh;
+ height: 30vh;
+ border:2px solid rgba(255,255,255,0.2);
+ border-radius: 50%;
+ z-index: 3;
+ transition: transform 1s linear ;
+}
+
+.star{
+ position: absolute;
+ background-color: rgba(255,255,255);
+ box-shadow: 0 0 10px 0px rgba(255,255,255,0.5);
+ border-radius: 50%;
+
+}
+
+
+#changeTheme{
+ position: absolute;
+ right:10px;
+ top: 10px ;
+ color:rgba(255, 255, 255, 0.594);
+ border: 1px solid;
+ padding:3px;
+ border-radius: 3px;
+ background-color: transparent;
+ transition: all 1s;
+}
+#changeTheme:hover{
+ background-color:rgba(255, 255, 255, 0.594) ;
+ color:#070f2b;
+
+}
\ No newline at end of file
diff --git a/sun1.jpg b/sun1.jpg
new file mode 100644
index 0000000..e5e952a
Binary files /dev/null and b/sun1.jpg differ