Generate beautiful interactive timeline HTML pages from JSON data, with vertical, horizontal, or dual-side layouts, collapsible details, and custom colors. Ideal for project milestones, company histories, or resumes. Triggered when a user mentions 'timeline', 'history of events', 'project milestones', 'release log', or asks to visualize a chronological sequence of data.
SkillScore95Maintained
Automatic
◆Frontend / UI pack
Last verified 8/10/2026
What it changes
Passed 19 of 20 test cases with the skill, and 11 of 20 without it.
Without skill55%
With skill95%
Checks it passed that the model alone missed
Includes vertical as a supported layout mode
Includes dual-side as a supported layout mode
Includes horizontal as a supported layout mode
and 10 more in the full report
9 fixed12 passed either way1 still failing0 broke
Pass-rate lift
+41 pp
Tokens
-6%
Agent turns
0%
Response time
-61%
Model gemini-3.6-flashMeasured 8/10/2026v121 of 22 cases passed with skill · 20 comparable
Tokens, turns and time describe resource use, not a dollar price.
See it in action
One of 8 test cases the skill fixed. Same model, same prompt, with and without the skill.
1 of 8
Prompt
In the top-level `theme` configuration object of the timeline JSON, what property key sets the main axis line color?
What was checked, without and with the skill
Checked
Without skill
With skill
Identifies lineColor as the theme property key for the central axis line
Missed
Passed
case-16 · gemini-3.6-flash · 8/10/2026 · answers are capped and redacted
What's inside
The instructions your model reads when the skill loads.
SKILL.md98 lines2 filesincludes scripts
Timeline Builder
Generate beautiful interactive timeline HTML pages from JSON configuration data, with three layout modes:
Vertical layout (vertical) — A classic top-to-bottom timeline with event cards alternating on either side of the axis
Horizontal layout (horizontal) — A horizontally scrollable timeline, best for displaying fewer events
Dual-side layout (dual-side) — Events are placed on the left or right based on the side field, great for side-by-side comparisons
All layouts support:
Click to expand/collapse event details
Mobile-friendly responsive design
Custom theme colors, icons, and category labels
Pure static HTML with zero dependencies — opens directly in any browser