YNAB Web Age of Money Badge

WHAT IT DOES

This tool enhances YNAB's budget metrics by adding a prominent, customizable badge that displays your Age of Money with trend indicators and color-coded status. It extracts Age of Money and Days of Buffering values from the page, showing them alongside each other in a compact panel. The badge changes color based on user-defined thresholds: green for strong (default 30+ days), yellow for building (15-29 days), and red for needs attention (0-14 days). The panel shows a historical view of Age of Money changes over time, allowing you to track your financial progress at a glance. Summary statistics include average age, range, and recent change, giving you deeper insight into your money's age trajectory.

WHERE IT RUNS

The script activates on YNAB pages (ynab.com), including the budget dashboard and reporting views. It automatically detects Age of Money and Days of Buffering values using multiple extraction strategies that work across different YNAB layouts. The panel appears as a draggable overlay that stays accessible as you navigate your budget.

HOW TO USE

Navigate to your YNAB budget page. The panel will appear showing your Age of Money as a large, color-coded number with Days of Buffering alongside. Use the "Green ≥" and "Yellow ≥" inputs to customize the color thresholds to match your financial goals. Toggle "Buffer on/off" to show or hide Days of Buffering. Toggle "History on/off" to enable or disable historical tracking — when enabled, the script records your Age of Money each time the page updates, building a history displayed in the panel. The "Refresh" button manually updates the data, and "Export" copies all metrics and history as JSON to your clipboard. Use "Clear History" to reset the tracking data.

THE TECHNICAL MECHANISM

The script employs a multi-strategy DOM extraction approach for YNAB's dynamic React-based interface. It first attempts modern data-testid selectors that YNAB uses for budget metrics, including age-of-money and days-of-buffering. When structured selectors fail, it falls back to a comprehensive text scanner that traverses visible DOM nodes using a TreeWalker, matching labeled patterns for "Age of Money" and "Days of Buffering". Each extraction attempt targets the current DOM state, capturing both the numeric value and any surrounding text. The trend indicator compares the current Age of Money against the last 5 historical records, calculating the direction and magnitude of change. Historical data is stored using GM_setValue with a maximum of 200 entries to manage storage size. Color thresholds are applied dynamically with real-time updates when settings change.

THE PANEL

The panel is fully draggable by its header and remembers its position on the page across sessions. It can be collapsed to a small bubble using the minimize button, then restored by clicking the bubble. The panel resizes automatically to fit its content and can be closed with the Escape key or by clicking the close button. The panel's position and state persist globally, so it returns to the same location on subsequent visits.

PLEASE NOTE

Requires the free BotGentz extension to run. YNAB may update its site structure, which could affect the script's ability to detect Age of Money values — updates will be released as needed. All Age of Money data and history are stored locally in your browser and are never transmitted externally. This tool is for informational purposes only and does not provide financial advice. The script does not modify your YNAB data or account in any way. Historical data is stored locally and may be lost if browser storage is cleared.