ClickUp Task Age Highlighter

WHAT IT DOES

This userscript brings visual task age awareness to ClickUp by color-coding tasks based on how long they've been open. It reads task creation dates from ClickUp task lists and board views, calculates the age in days, and applies configurable color-coded highlighting to make aging tasks instantly visible. Each task receives an age badge showing the exact number of days since creation, and the background of the task item is highlighted with a color that corresponds to its age range. The script comes with default age thresholds (0-3 days green, 4-7 days yellow, 8-14 days orange, 15-30 days red, 30+ days dark red) that you can fully customize. You can choose between badge-only, background-only, or combined display modes, and optionally exclude completed tasks from highlighting.

WHERE IT RUNS

The script activates on all ClickUp task views, including list views (clickup.com/list/*), board views (clickup.com/board/*), and individual task views. It works across all ClickUp workspaces and automatically detects task items as they load or scroll into view.

HOW TO USE

After installation, navigate to any ClickUp task list or board. The script automatically scans visible tasks, calculates their age, and applies the configured highlighting. Age badges appear next to task titles showing the age in days. The panel allows you to adjust age ranges and colors, toggle between display modes, exclude completed tasks, and control auto-refresh behavior. Click "Refresh Highlights" to manually reapply highlighting after making changes. The script automatically updates as you scroll through long lists, ensuring all tasks are highlighted.

THE ACTUAL REASON IT WORKS

Unlike browser extensions that rely on ClickUp's API (which requires OAuth authentication and has rate limits), this script performs client-side DOM scraping with intelligent date extraction. It uses a cascade of selector strategies designed for ClickUp's dynamic React-rendered interface - first targeting data-testid attributes, then class-based patterns, then structural heuristics. For date extraction, the script employs multiple parsing strategies: it checks for explicit date elements, parses date strings in various formats (MM/DD/YYYY, YYYY-MM-DD, DD/MM/YYYY), and even extracts relative time references like "2 days ago" from text content. The age calculation uses real-time comparison with the current date, and the highlighting is applied by dynamically adding CSS classes that override ClickUp's default styling without breaking the underlying React components.

THE PANEL

The panel is fully draggable by its header and remembers its position across page loads using GM_setValue. It collapses to a small icon when minimized, preserving workspace. Press Escape or click the × button to close the panel. The panel includes an age rules editor where you can add, remove, or modify age thresholds and their associated colors using number inputs and color pickers. A live preview circle shows each rule's color. The panel also provides toggle switches for display mode, excluding completed tasks, showing tooltips, and auto-refresh.

PLEASE NOTE

This userscript requires the free BotGentz extension to run. The script reads only task data visible on the current page - it does not load additional items beyond what is rendered in the viewport. For large boards, ensure all tasks are loaded by scrolling before applying highlights. ClickUp periodically updates its interface, which may affect task detection; we actively maintain the script for compatibility. The script does not send any data to external servers - all processing occurs locally in your browser. Age calculations are based on the creation date as displayed in ClickUp; manually created or imported tasks with missing dates may not be highlighted.