AnyTool
Your files never leave your device. All processing happens locally in your browser.

How do I make a Gantt chart?

Open AnyTool Gantt Chart Maker and you get a starter project with five tasks already on the timeline. Add a task or milestone, then set its name, start date and end date (or type a duration in days) and a percent-complete in the table on the left — the bar on the right moves, resizes and fills instantly. Link a task to its predecessors and a finish-to-start arrow is drawn between the bars; mark a zero-duration item as a milestone and it shows as a diamond. Switch the timeline between days, weeks and months, shade weekends, and read off the red “today” line. The whole plan is saved automatically in this browser’s localStorage, and you can export it as a PNG image or a JSON file (and import the JSON back) — everything runs 100% in your browser, nothing is uploaded.

  • Task table on the left: name, start, end / duration in days, % complete, colour, assignee and dependencies
  • Timeline on the right: horizontal bars with a progress fill, milestone diamonds and finish-to-start dependency arrows
  • Day / week / month scale, weekend shading and a red today line; project start & end derived automatically
  • Export the chart as PNG and the whole plan as JSON; import JSON to restore — 100% client-side
  • Saved locally in your browser; honest limits — no auto-reschedule and no true critical path

What is

Gantt chart

A Gantt chart is a horizontal bar chart that visualises a project schedule over time: each task occupies a row with a bar whose left edge sits on its start date and whose length spans its duration along a calendar axis, so the timing and overlap of tasks are visible at a glance. Bars can show progress as a filled portion, milestones appear as zero-duration diamond markers, and dependencies are drawn as arrows between bars — most commonly finish-to-start, where one task must finish before the next begins. AnyTool’s Gantt Chart Maker is a 100% client-side project-timeline builder with a task table, a scalable timeline (days / weeks / months), a today line and PNG/JSON export, saved to your browser’s localStorage.

Generators

Related terms

Project timelineTask barMilestoneDependencyFinish-to-startCritical pathProject schedule

Frequently Asked Questions

It is saved only in your browser’s localStorage and never uploaded — there is no account, server or tracking, so it stays completely private to this browser.

AnyTool Gantt Chart Maker is 100% client-side. The entire plan — every task, date, dependency, milestone and progress value — is stored in your browser’s localStorage and is never sent to any server. There is no sign-up, no login and no analytics, and the tool keeps working offline once the page is cached. Because the data lives only in your browser, clearing your browsing data or switching to a different browser or device removes it, so use Export to download a JSON backup (or a PNG snapshot) you can keep and re-import any time.

Link a task to its predecessors and a finish-to-start arrow is drawn from the predecessor’s end to the successor’s start; mark a zero-duration item as a milestone and it renders as a diamond marker.

In the task editor you can pick one or more predecessor tasks; for each, a finish-to-start arrow is drawn on the timeline from the end of the predecessor’s bar to the start of the successor’s bar, so the sequence of work is visible. Marking a task as a milestone makes it zero-duration and draws it as a diamond at its date — ideal for kickoffs, launches, approvals and other key dates. Be aware these dependency links are visual only: the tool does not auto-reschedule successors when you move a predecessor and does not compute a true critical path, so you set and adjust each task’s dates yourself.

Yes — switch the timeline between days, weeks and months, optionally shade weekends, and a red dashed line marks today across the chart.

The timeline has a days / weeks / months scale toggle that changes how wide each day is drawn and what the header ticks show — day numbers with month labels, week-start dates, or month names — so you can zoom from a tight two-week sprint to a multi-month roadmap. In day view you can shade weekend columns to make working days clearer. A red dashed today line runs down the chart whenever the current date falls within the project range, giving instant context for whether a task is ahead of or behind schedule. The project’s overall start and end are derived automatically from your earliest start and latest end, with a little padding.

Use Export to download the chart as a PNG image or the whole plan as a JSON file, and Import to load a JSON file back on any browser or device.

Because the plan is a personal, single-device tool with no cloud sync, exporting is how you back it up or move it. PNG export renders the timeline node to an image with html2canvas so you can drop it into a deck, doc or email. JSON export downloads the entire plan — name, tasks, dates, dependencies, milestones and progress — as a formatted file; Import reads such a file and replaces the current plan with it, validating and migrating the data so an older or hand-edited file still loads safely. Keep an exported JSON backup so a cleared cache or a switched browser never loses your work, and use the same files to carry a snapshot to another device or hand it to someone else.

Detailed Explanation

Methodology

The Plan Model and Timeline Positioning

AnyTool Gantt Chart Maker keeps a single plan object as its source of truth: a plan has a name and an ordered array of tasks, and each task carries a name, an ISO start date, an ISO end date, a 0–100 percent-complete, a colour, an optional assignee, an isMilestone flag and an array of predecessor task ids. The project date range is derived automatically as the earliest start to the latest end, padded by two days on each side, and a per-day pixel width set by the day/week/month zoom converts dates to positions. Each task row’s bar is placed at left = daysBetween(projectStart, task.start) × dayWidth and given width = (durationDays + 1) × dayWidth so the span is inclusive of both end days; the progress fill is simply that width × progress ÷ 100. A milestone is a zero-duration task drawn as a diamond centred on its date instead of a bar. The same date maths drives the header ticks (day numbers, week-start dates or month names depending on zoom), a red dashed today line when the current date is in range, and optional weekend shading in day view.

  • Plan → tasks (ordered array); each task has start, end, progress, colour, milestone flag and predecessor ids
  • Project range = earliest start → latest end (padded); a per-day pixel width is set by the zoom
  • Bar left = daysBetween(projectStart, start) × dayWidth; width = (duration + 1) × dayWidth (inclusive)
  • Progress fill width = bar width × progress ÷ 100; a milestone is a zero-duration diamond
  • Editing a date or duration repositions and resizes the bar live
How It Works

Dependencies, Milestones and Scale

Each task can list predecessor tasks; for every predecessor an SVG elbow arrow is drawn from the end of the predecessor’s bar to the start of the successor’s bar, modelling a finish-to-start relationship — the most common dependency type, where a task can only begin once its predecessor finishes. Milestones are zero-duration markers rendered as diamonds for kickoffs, launches, approvals and sign-off dates. The timeline scale toggles between days, weeks and months, changing both the pixel width per day and the header ticks, so the same plan can be viewed as a tight sprint or a multi-month roadmap; weekend columns can be shaded in day view and a red dashed line marks today. A stats strip summarises the task and milestone counts, the derived date range, the total work-days and the average progress across real tasks.

  • Dependencies are finish-to-start, drawn as SVG elbow arrows from a predecessor’s end to a successor’s start
  • Milestones are zero-duration diamond markers for key dates
  • Days / weeks / months scale changes the per-day width and the header ticks
  • Optional weekend shading (day view) and a red dashed today line
  • Stats strip: task & milestone counts, date range, total work-days and average progress
Privacy & Security

Local Storage, Export and Honest Limits

Everything runs locally in the browser with no account, server or tracking. The whole plan is serialised to localStorage on every change, so it survives a refresh, and the tool works offline once the page is cached — nothing is ever uploaded. Export renders the timeline node to a PNG with html2canvas (lazy-loaded only when you click) and also exports the whole plan as formatted JSON; Import validates and migrates such a JSON file — clamping progress, keeping end ≥ start, dropping dependency ids that no longer point at a real task — before replacing the plan, so older or hand-edited files load safely. Honestly, this is a personal, single-device planner: there is no cloud sync, no shared link, no comments and no collaborator assignment. Crucially, the dependency arrows are a visual finish-to-start link only — the tool does not auto-reschedule successors when a predecessor moves and does not compute a true critical path, so you set and adjust each task’s dates yourself. Because the data lives only in your browser, keeping an exported JSON backup is recommended, and resetting to the starter example asks for confirmation.

Gantt Chart: in-browser (AnyTool) vs typical online Gantt apps
CapabilityAnyToolTypical online Gantt apps
Where it runs100% in your browser, nothing uploadedHosted — plan stored on a server
AccountNone — open and useUsually sign-up / login required
Task bars & progressYes, with proportional progress fillYes
DependenciesFinish-to-start arrows (visual)Yes, often with auto-scheduling
MilestonesZero-duration diamond markersYes
Auto-reschedule / critical pathNo (adjust dates yourself)Often included (paid plans)
ScaleDays / weeks / months toggleYes
Export / backupPNG + full-plan JSON; import JSONCloud sync; export sometimes paid
PrivacyPlan only in localStorageData held in the vendor cloud

AnyTool runs the whole chart locally and uploads nothing; it is a private, single-device planner with PNG/JSON export rather than a synced, auto-scheduling service.