Skip to content
GenAI Skills Docs
Get AI Business OS

The Timeline

PRIMA Project ManagementCommand: /timeline

/timeline draws a Gantt chart of your projects as a single HTML page and opens it in your browser. Each project with a start date and a due date becomes a bar, and its milestones appear as diamonds on that bar. Claude builds the page fresh each time you run the command, so it always reflects your project register as it stands.

Before You Start

Section titled “Before You Start”

A project appears on the timeline only when it has both a startDate and a dueDate in your register. You set these when you answer yes to delivery tracking in /newproject, or later by asking Claude in plain words, such as “set the due date for P012 to 30 November”. Projects without both dates are left out because there is nothing to plot.

When no project has both dates, Claude stops and tells you so.

No projects have delivery dates set. Use the project-tracking skill to add startDate and dueDate to your projects, or set them during /newproject.

Draw the Timeline

Section titled “Draw the Timeline”
  1. Type /timeline in Claude Code to start the command from your workspace.
  2. Choose option 1 for every project with delivery dates, or pick one project from the numbered list Claude shows.
  3. Wait while Claude writes the HTML file and opens it in your default browser.
  4. Read the summary in chat, which gives the number of projects, the months covered and the milestone counts.
**Timeline scope:**


1. All active projects (4 projects with delivery dates)
2. Single project — choose from:
   [P012] Spring Workshop (in-progress)
   [P014] Website Refresh (paused)


Which option?

Scope Choices

Section titled “Scope Choices”

All Projects

Section titled “All Projects”

Option 1 plots every project that has delivery dates, sorted by start date. The file goes to Documentation/Reports/project-timeline.html.

One Project

Section titled “One Project”

Option 2 draws a timeline for a single project and shows its milestones in detail. The file goes into that project’s own folder, as project-timeline.html inside the folder named in the project’s path field.

What the Page Shows

Section titled “What the Page Shows”

The page has a dark background, project names in a column on the left and the bars on the right. A legend at the top explains the colours, and a subtitle shows when the page was generated.

Element What it means
Bar Runs from the project’s startDate to its dueDate
Blue bar Status in-progress
Amber bar Status paused
Red bar Status overdue
Grey bar Status archived
Dot before the name Priority, red for high, amber for medium and green for low
Filled green diamond A milestone with status done
Outlined diamond A milestone with status pending
Red dashed line Today
Vertical grid lines Month boundaries, labelled with the month and year

Hover over a bar to see the project name, its date range and the days remaining or overdue. Hover over a milestone to see its name, date and status. A milestone dated outside its project’s start and due dates still appears at its own date.

Opening the Page

Section titled “Opening the Page”

On macOS, Claude opens the file in your default browser and copies the page’s local address to the clipboard. On Windows, the command gives the matching steps with start and clip. The command has no open step for Linux, so on Linux you open the file yourself from the path in the summary.

To view the page inside VS Code, open the Command Palette, run “Browser: Open Integrated Browser” and paste the address from the clipboard.

The page has its styles and scripts inline and loads nothing from the internet. Running /timeline again overwrites the previous file with a new one.

The Timeline and the Dashboard

Section titled “The Timeline and the Dashboard”

The dashboard has its own Timeline view, with zoom levels and paging, built from the same register, while /timeline is the quicker page with one purpose, and Dashboard Views describes the dashboard version.

Section titled “Related Pages”