My own new tab

devlog 5#

Updated the project with a few bigger additions. Added NASA’s Astronomy Picture of the Day API that fetches a real space photo (or video) every day and caches it so it only pulls fresh data once daily instead of every load. Had a bug where nothing showed up at all, turned out to be a day where NASA’s photo was actually a video, so added handling for that.
Also reworked the layout of the quote card and APOD card they used to be stacked on top of each other, now they sit side-by-side as a matched pair below the search bar, which reads a lot more intentional than one long column. Also added a focus mode (top-right corner) that hides everything except the clock, greeting, and search bar for when you just want a clean minimal tab.

devlog 3#

Updated the project with a bunch of new stuff. Added a quote card that pulls a random quote from an API each time you open a new tab, with a “New thought” button for another one on demand. Built a bookmarks row too (with the help of AI), turned it into a floating dock at the bottom of the screen instead of just another block on the page feels way more like a real product now. Then added weather using OpenMeteo (grabs your location through the browser) showing temp and conditions under the greeting, plus a / shortcut (and Ctrl+K) that jumps straight into the search bar from anywhere on the page.

devlog 2#

Day 2 of working on a custom new tab. Ive added a search bar that uses google (like you type anything inside it, press enter and it goes straight to google with what youre trying to find.

Devlog #1

Today ive started building my own custom new tab, aka doing the “give your website a pulse” mission.

I began with a completely blank project and built the foundation using HTML, CSS, and JavaScript. The first goal wasnt to make everything at once, but to get the personality of the page right before adding more features.
The first major feature is now working: a live digital clock that updates automatically. I also added a time-based greeting.

I also started shaping the visual identity. I decided to build the interface around #6A498E, using a dark purple background, softer lavender highlights, and a subtle purple glow behind the main content. (thanks chatGPT for finding this beautiful pallate by using my favorite color)