How I Built My Personal Dashboard (and How to Tweak It)

After giving away the dashboard template on the Free Apps page, someone asked how it actually works. Instead of giving you a dry manual, I thought I’d just let you look over my shoulder while I walk you through how I use it and how I make changes to it.

The Layout: My Daily Workflow

When I open this file, I treat it as my “mission control.” The top section is all about speed. I’ve organized my most-visited sites into columns—Tools, Websites, AI, etc. Instead of typing pagespeed.web.dev or digging through a messy bookmark bar, I just click once.

Below that, I added a Password Generator. I found myself constantly needing secure, random strings for new accounts or Email accounts, so having it built directly into my home screen saved me from having to search for a “random password generator” website every time.

How I Handle the Code

If you open the file in a code editor, it might look like a lot of text, but it’s actually quite intuitive. Here is how I approach editing it.

1. The “Hands-Off” Zone There are parts of the code I generally leave alone. The <style> section at the top controls the dark theme and the layout. While you can change the colors, I usually leave the CSS as is to ensure the grid stays aligned and the buttons look crisp. Similarly, I don’t touch the <script> section at the bottom—that’s the “engine” that makes the date update and the password generator actually function.

2. Adding My Own Links When I want to add a new site, I look for the <ul> (unordered list) section. I simply find the category I want and add a new list item. It looks like this:

<li><a href="https://yourlink.com">Your Site Name</a></li>

If I want to start a new category entirely, I just copy one of the div class="link-list-column" blocks and paste it right next to the others.

3. Adjusting the Password Generator I occasionally find that 36 characters is too long for some sites, so I change the value="36" with the up/down buttons. If I want my default starting length to be shorter, I just change that number to 16 or 24.

A dark-themed personal productivity dashboard showing a grid of quick-access links and a password generator tool.
Actual screenshot of the dashboard app

My Final Verdict

I’ll be honest: when I first started, it was just a small project to stop typing the same URLs over and over. But as I spent an hour or two tailoring it—adding every single link I use for my business and my hobbies—it quickly became my favorite app.

There is something incredibly satisfying about having a single, lightweight file that belongs to you, runs offline, and puts your entire digital workspace exactly where you want it. Give it a try, tweak it until it feels right, and see how much faster your morning routine becomes.