No work days logged yet. Use the Time Tracker tab to add days.
Invoice Total
$0.00
Hours: 0.00Labor: $0.00Fees: $0.00
Current Time
--:--
Press "Clock In" to start tracking
Today's Session
No segments yet. Clock In to start.
Add Segment Manually
"Less" subtracts break time from hours worked — clock times are not changed.
Add Line Item
Current Line Items
No flat-fee line items yet.
Invoice Totals
Hours
0.00
Labor
$0.00
Grand Total
$0.00
All Invoices
Drag to reorder
Drag any row to reorder. Click an invoice to open it. Delete removes it permanently.
No invoices yet.
Search Invoices
Start typing to search saved invoices.
Your Information (appears on every invoice)
Invoice Defaults
Saved Clients
No clients saved yet. They are remembered automatically when you save an invoice.
New Client
☁ GitHub Sync
Paste your GitHub Personal Access Token (gist scope only) to enable
automatic cloud sync. Your data is saved to a private GitHub Gist —
invisible to anyone without the token.
On your Mac (first time):
1. Paste your GitHub token above → click 💾 Save Token
2. Click ☁ Sync Now — creates the Gist and fills in the Gist ID
3. Copy the Gist ID (it appears above after sync)
On your iPhone:
1. Paste the same GitHub token → click 💾 Save Token
2. Paste the Gist ID from your Mac
3. Click 💾 Save Token again to save the Gist ID
4. Click ⬇ Pull from Gist — your invoices appear
Every day after that:
Data syncs automatically in the background on every save.
Export / Import Data
Export saves all your invoices, clients, and settings to a file.
Import restores from that file on any device.
Use AirDrop or iCloud Drive to move the file between devices.
🚀 Getting Started
Go to My Info → fill in your name, business, address, phone, email, and invoice prefix (e.g. INV-). Click Save My Info.
Click + New Invoice in the top bar.
Fill in the client info on the Invoice Info tab.
Go to Time Tracker → clock in and out, then click Add This Day to Invoice.
Go to Preview → review the invoice, then click Print / Save PDF.
🧾 Invoice Info Tab
Invoice Details
Invoice # — auto-generated from your prefix and counter (set in My Info). Edit freely.
Date — invoice date. Defaults to today.
Due Date — stored for your records; the invoice prints Terms: Net 30 instead.
Terms — editable (Net 30, Due on Receipt, etc.). Appears on the printed invoice.
Status badge (top right of the card) — click to cycle: Draft → Sent → Paid. Also clickable in the All Invoices tab.
Client (Bill To)
Load a recent client dropdown — pick any saved client to autofill all fields including the hourly rate.
Clear button — wipes all client fields blank.
Client address is formatted for a standard envelope window when printed.
Hourly Rate
Set your rate here. It autofills when you load a saved client (if a rate was saved with them).
Rate is stored per-client in your address book automatically when you save the invoice.
Work Days
Shows all days logged on this invoice. Each entry has Edit and Remove buttons.
Edit — loads that day back into the Time Tracker so you can adjust times, break, or description.
⏱ Time Tracker Tab
Clock In / Out (multi-segment)
Click Clock In when you start — time rounds to the nearest 5 minutes automatically.
Click Clock Out when you stop. Repeat as many times as needed in a day — each pair is one segment.
The gap between segments is automatically shown as a break — no math needed.
Each green segment row shows start → end and hours worked. Click ✕ to remove a segment.
Add Segment Manually
Enter Start and End times using the time picker.
Less (min) — optional break in minutes. Leave blank for a straight shift. Fills one segment with the break subtracted from total hours. Your real clock times are never changed.
Click + Add to add the segment.
Adding a Day
Fill in the Description of work done, then click Add This Day to Invoice.
The date automatically advances by one day so you're ready for the next entry.
Repeat across multiple days — all days stack up on the same invoice until the job is done.
Each item shows as a separate row on the invoice: Description | Amount.
The totals bar shows Total Hours, Labor subtotal, and Grand Total.
👁 Preview Tab
Shows the formatted invoice exactly as it will print.
🕐 Show Time Detail button — toggles your internal time records (per-day segments, break info). When ON, that detail prints too — good for your own records copy. When OFF, the client sees a clean invoice with just Labor and total amount.
Print / Save PDF — opens the browser print dialog. Choose Save as PDF to get a file.
Save Invoice — explicitly saves the current invoice and adds the client to your address book.
The invoice prints with only two columns: Description | Amount. No rate, no per-day hours — clean and professional.
All work descriptions are joined into one paragraph below the Labor line.
🔍 Search Tab
Type anything — invoice number, client name, company, or any word from a description.
Results show in real time. Click any result to open that invoice.
The total shown on each result matches the Preview total exactly.
📋 All Invoices Tab
Shows every invoice with its status, total, and action buttons.
Status badge — click to cycle Draft → Sent → Paid → Draft without opening the invoice.
Outstanding / Paid totals at the top — Outstanding includes all Draft and Sent invoices; Paid shows everything marked Paid.
Drag ☰ to reorder invoices. Order saves immediately.
Open — loads the invoice into the editor.
Delete — permanently removes the invoice after confirmation.
👤 My Info Tab
Your Information
Name, business name, email, phone, and address — appear on every invoice in the header.
Invoice Defaults
Prefix — e.g. INV- produces INV-001, INV-002…
Next Invoice # — the counter that auto-increments with each new invoice.
Saved Clients
Clients are saved automatically when you click Save Invoice.
+ Add Client — manually add a client including their hourly rate.
Load — fills the current invoice's client fields and hourly rate.
Delete — removes from the address book (doesn't affect invoices).
Clear All — wipes the entire client list. Use this if you see duplicate or partial entries from an old bug.
Export / Import
⬇ Export All Data — downloads a invoice-data-YYYY-MM-DD.json file with all invoices, clients, and settings.
⬆ Import Data — picks a previously exported file and merges the data. If duplicates are found, you choose whether to replace with the imported version or keep the existing one.
Use AirDrop or iCloud Drive to move the export file between your iPhone and Mac.
GitHub Gist Sync
Automatically syncs your data to a private GitHub Gist so it's always backed up and accessible from any device.
Requires a free GitHub account and a Personal Access Token with gist scope.
See the GitHub Gist Sync section below for setup instructions.
☁ GitHub Gist Sync — Setup
Step 1 — Create a GitHub account
Go to github.com and sign up for a free account if you don't have one.
Step 2 — Get a Personal Access Token
Sign in to github.com and click your profile photo in the top-right corner.
Click Settings near the bottom of the dropdown menu.
In the left sidebar, scroll all the way to the bottom and click Developer settings.
Click Personal access tokens → Tokens (classic).
Click Generate new token → Generate new token (classic).
Give it a name like Invoice App.
Set Expiration to No expiration so you don't have to repeat this.
Under Select scopes, check gist only — that's the only permission needed.
Scroll down and click Generate token.
Copy the token immediately — GitHub only shows it once. Paste it somewhere safe.
Step 3 — Connect this app
In this app go to My Info → GitHub Gist Sync.
Paste your token into the GitHub Token field and click Save Token.
Click Sync Now — it creates a private Gist and saves the Gist ID automatically.
You'll see a ✓ Last synced message when it works.
Step 4 — Set up your other device
Open the app on your other device (Mac, iPad, iPhone).
Go to My Info → GitHub Gist Sync.
Enter the same token and the Gist ID shown on your first device.
Click Pull from Gist — all your invoices and clients will appear.
How it works day to day
Auto-sync — pushes to the Gist automatically after saving invoices, adding days, deleting, etc.
Sync Now — manually pushes everything immediately.
Pull from Gist — fetches the latest Gist data and merges it. Safe to run anytime.
The Gist is private — only visible to your GitHub account, not the public.
If your token expires, generate a new one and update it in My Info.
📱 Using on iPad / iPhone
Same WiFi as your Mac — find your Mac's IP in System Settings → WiFi → Details, then open http://192.168.x.x:5500 (or whatever port your server uses) in Safari on the iPad.
Add to Home Screen — in Safari, tap Share → Add to Home Screen. Opens fullscreen like a native app.
GitHub Gist — the easiest way to keep phone and Mac in sync automatically.
Export / Import — export on one device, AirDrop to the other, import. Takes about 10 seconds.
📊 QuickBooks Export
Open any invoice and go to the Preview tab.
Click the green QB Export button — downloads a .csv file formatted for QuickBooks Online.
In QuickBooks Online: Settings ⚙ → Import Data → Invoices → upload the CSV → map columns → Start Import.
Each work day and flat-fee line item becomes its own row in the CSV, grouped under the same invoice number.
Customer name in the CSV must match your QuickBooks customer name exactly — QBO will create the customer automatically if it doesn't exist yet.
Item (Product/Service) is set to Services — a safe generic name. Rename it in QBO after import if you use a different service item name.
const b={};for(let k in localStorage){if(localStorage.hasOwnProperty(k))b[k]=localStorage.getItem(k);}const a=document.createElement('a');a.href=URL.createObjectURL(new Blob([JSON.stringify(b,null,2)],{type:'application/json'}));a.download='invoice3-backup-'+new Date().toISOString().split('T')[0]+'.json';a.click();