Atomic Clock — Desktop Widget by AtomCoder01

A lightweight, always-on-desktop clock widget for Windows. Built with Electron, it sits pinned to your desktop layer (like Rainmeter) — never covering your apps, and never getting covered by them.

You can download from here

So i was looking for something that adds widgets to my windows Homescreen, but i couldn't find the one i wanted. So i made it. the idea come from nicocodes9

✨ Features

• Sticks to the desktop — pinned into Windows' desktop layer, so it stays visible when you switch between apps, minimize windows, or hit Win+D
• Freely draggable — click and drag anywhere on the widget to reposition it; your position is remembered across restarts
• Customizable font — pick from several built-in fonts, or browse and use any .ttf/.otf font file from your own device, via the Settings window
• Gradient text color — choose a two-color gradient (or a single solid color) and adjust the angle live
• Runs at startup — launches automatically when you log into Windows
• Tray controls — right-click the tray icon to open Settings, reset the widget's position, or quit

📸 Screenshots

🖥️ Requirements

• Windows 10 or 11
• Node.js (v18 or newer recommended)
• For building the installer from source: Visual Studio Build Tools 2022 with the "Desktop development with C++" workload (needed by a native dependency used to pin the widget to the desktop)

🚀 Getting Started (development)

Clone or download this repo, then from the project folder:

npm install
npm start

This launches the widget directly via Electron, without building an installer — useful for testing changes.

📦 Building the Application

To package the widget into a distributable Windows installer:

npm run build

This runs electron-builder using the config in package.json and produces an installer .exe inside the dist/ folder (e.g. dist/Desktop Clock Widget Setup 1.0.0.exe).

Alternatively, to build specifically for 64-bit Windows:

npm run package

Installing the built app

1. Go to the dist/ folder created by the build.
2. Run the Desktop Clock Widget Setup *.exe installer.
3. Follow the install wizard (you can choose the install location).
4. Once installed, the widget launches automatically and also starts automatically on future logins.

Uninstalling

• Go to Windows Settings → Apps → Installed apps, search for "Desktop Clock Widget", and click Uninstall.
• Or run Uninstall Desktop Clock Widget.exe directly from the install folder (default: %LOCALAPPDATA%\Programs\desktop-clock-widget\).

⚙️ Customizing

Right-click the tray icon (click the ^ arrow in your taskbar to find it if it's hidden) and left click and choose Settings... to:

• Change the clock's font — either pick one of the built-in presets, or click "Browse font file..." to use any .ttf/.otf font already on your computer. The chosen font is embedded into your settings automatically, so it keeps working even if you later move or delete the original file.
• Set a gradient (or solid) text color and angle

Changes apply instantly — no restart needed.

If you'd rather bundle a font permanently into the app itself (so it ships with every install, rather than being picked per-device):

1. Drop the font file (.otf/.ttf) next to index.html.
2. Add a matching @font-face rule in index.html's <style> block.
3. Add a matching <option> in settings.html's font dropdown.

🛠️ Tech Stack

• Electron
• electron-builder — packaging/installer
• electron-as-wallpaper — pins the widget to the Windows desktop layer

🍀 Acknowledgements

This project was inspired by nicocodes9/desktop-clock-widget. Big thanks for the original idea.

📄 License

ISC — see LICENSE for details.