Turn messy project data into stunning, shareable roadmaps.
One HTML file. Zero dependencies. Works everywhere.

Quickstart · Examples · How It Works · Contributing

Paste your Jira export, spreadsheet, markdown notes, or just describe your project in plain English. Get back a single .html file you can download, email, or present in your next meeting — no installs, no logins, no subscriptions.

You've been in this meeting. Someone asks "where's the roadmap?" and the answer is a 47-tab spreadsheet, a Jira board with 200 tickets, or a Confluence page last updated in Q2.

simple-visuals fixes that in 60 seconds:

Download these and open in your browser — that's the whole experience:

💡 These aren't screenshots — they're the actual output files. Download, double-click, done.

git clone https://github.com/your-username/simple-visuals.git
mkdir -p ~/.claude/skills/simple-visuals
cp simple-visuals/skills/simple-visuals.md ~/.claude/skills/simple-visuals/SKILL.md

Then in any Claude Code session:

/simple-visuals

That's it. Paste your data, confirm the dates, get your roadmap.

Copy the contents of skills/simple-visuals.md and paste it as your first message in claude.ai, then follow up with your project data.

Every LLM roadmap tool has the same flaw: LLMs can't do calendar math. They guess what day April 15th falls on. They miscalculate durations. They place bars in roughly the right spot instead of exactly the right spot.

simple-visuals takes a different approach:

┌─────────────────────────────────────────────────────┐
│  1. Generate calendar table via python               │
│     → Every date, day-of-week, week number, quarter │
│                                                      │
│  2. Compute all positions via python                 │
│     → left: 18.13%, width: 29.12%                   │
│                                                      │
│  3. Validate with user before rendering              │
│     → "Does this look right?"                       │
│                                                      │
│  4. Generate HTML with computed values only           │
│     → Pixel-accurate timelines, every time          │
└─────────────────────────────────────────────────────┘

The LLM never does date math. Every percentage, every position, every duration is calculated by actual code. The result: timelines that are correct down to the pixel.

📎 Jira CSV/JSON export       → paste it
📊 Excel / Google Sheets      → copy-paste the rows  
📝 Markdown with dates        → works great
💬 Plain English              → "engineering starts May 4 for 8 weeks"
🔀 All of the above at once   → yep, that too

See the Input Guide for tips on getting the best results.

• 📄 One HTML file — inline CSS, no JavaScript dependencies
• 🎨 Clean, modern design — system fonts, thoughtful spacing, professional palette
• 📊 Executive summary — status callout box at the top for quick context
• 🏊 Swimlanes — group by team, workstream, or theme
• 💎 Milestones — diamond markers for key dates
• 📍 Today marker — red vertical line showing where you are
• 🖨️ Print-ready — preserves colors, no scrollbars
• 🌐 Works offline — no internet required to view

skills/          → Claude Code skill prompts (the core product)
templates/       → Reference HTML templates  
examples/        → Example outputs you can open right now
docs/            → Documentation and guides

• Multi-month Gantt/timeline view with exec summary
• Week-by-week sprint detail view
• Date anchoring protocol (compute, never guess)
• Business days mode (Mon–Fri) and calendar days mode
• Accept-anything input handling

• Process flow / decision tree diagrams
• Strategy maps (objectives hierarchy)
• Dependency graphs
• Consistent visual style across all templates

• Community-contributed templates
• Persona presets (executive summary, team planning, architecture)
• Template gallery with previews

Contributions welcome! The guiding principle:

The baseline should be consistent, and it's the prerogative of the artist to paint their masterpiece.

A few rules:

• Every template produces a single HTML file with zero dependencies
• All date math must be computed, never estimated
• New templates go in templates/, with a working example in examples/
• Keep the design language consistent — clean, modern, executive-ready

MIT — use it however you want.

_{Built with 🧠 and Claude Code. If this saved you time, give it a ⭐}