DEV Community

Weather Clock Dash
Weather Clock Dash

Posted on

I Built a Free Firefox New Tab Extension with Live Weather and World Clocks

I spent a few weekends building a Firefox browser extension because I was tired of my new tab page doing absolutely nothing useful.

The result: Weather & Clock Dashboard — a replacement new tab that shows live weather, a 3-day forecast, and clocks for any cities you care about.

What it does

  • Live weather: Current conditions with temperature, humidity, and feels-like for your location
  • 3-day forecast: See what's coming so you can actually plan your day
  • World clocks: Multiple cities displayed in real time — great for remote teams across time zones
  • Search bar: Quick search without switching tabs
  • Dark/light mode: Respects your preference, toggles with one click

Why I built it

I was using Firefox's default new tab (tiles of recent sites). It told me nothing useful at a glance.

I wanted something that answered "should I bring an umbrella?" and "is my colleague in London even awake yet?" in under a second, without switching apps.

The tech (refreshingly simple)

  • Pure HTML, CSS, and vanilla JavaScript — no framework, no npm, no webpack
  • Uses Open-Meteo for weather (free API, no key required)
  • All data stays local — no servers, no accounts, no tracking
  • MIT licensed and fully open source

The entire extension is about 300 lines of JavaScript. Sometimes the best solution is the simplest one.

Install it

Weather & Clock Dashboard on Firefox Add-ons

Free, takes 10 seconds to install, no account required.

Also: Quick Calculator

I also published Quick Calculator & Unit Converter — a sidebar calculator that handles unit conversions (km ↔ miles, Celsius ↔ Fahrenheit, etc.). Same approach: useful, fast, zero setup.


Happy to take questions or feedback. What does your current new tab setup look like?

Top comments (0)