This is a simple but energetic Google Chrome extension that replaces the default new tab page with a dynamic, comic-book-themed countdown to the end of the year. It's designed to be a fun and visually exciting reminder of the time remaining, helping you stay motivated and focused on your goals. POW!
- Comic Book UI: A vibrant, colorful design inspired by classic Marvel comics, complete with a halftone dot background, bold fonts, and angled panels.
- Live Countdown: Displays the remaining days, hours, minutes, and seconds until the end of the current year.
- Dynamic Animations: The "Seconds" box shakes to create a sense of urgency and action!
- Inspirational Quote: Features a heroic quote to keep you motivated.
- Lightweight & Fast: No external libraries needed, ensuring your new tab page loads instantly.
The extension is built with four simple files:
manifest.json: The core configuration file that tells Chrome how the extension works.newtab.html: The HTML file that provides the structure for the new tab page.style.css: The CSS file that creates the awesome comic book styling and layout.newtab.js: The JavaScript file that powers the countdown logic.
To get this extension running in your own Chrome browser, follow these simple steps:
-
Download the Files: Make sure you have all four files (
manifest.json,newtab.html,style.css,newtab.js) saved in a single folder on your computer. Let's call the folderYear End Countdown. -
Open Chrome Extensions: Open your Google Chrome browser, type
chrome://extensionsinto the address bar, and press Enter. -
Enable Developer Mode: In the top-right corner of the Extensions page, find the "Developer mode" switch and turn it on.
-
Load the Extension:
- Three new buttons will appear. Click on the "Load unpacked" button.
- A file selection window will open. Navigate to and select your
Year End Countdownfolder (the entire folder, not the individual files). - Click "Select Folder".
-
Done! The extension is now installed. Open a new tab (
Ctrl+TorCmd+T) to see your new comic book countdown in action!
Feel free to change the colors, fonts, or the quote in the style.css and newtab.html files to make it your own. The font used is "Bangers" from Google Fonts.
Built to make deadlines more heroic!