# Timeline > **Back to [Style Guide](../mermaid_style_guide.md)** β€” Read the style guide first for emoji, color, and accessibility rules. **Syntax keyword:** `timeline` **Best for:** Chronological events, historical progression, milestones over time, release history **When NOT to use:** Task durations/dependencies (use [Gantt](gantt.md)), detailed project plans (use [Gantt](gantt.md)) > ⚠️ **Accessibility:** Timelines do **not** support `accTitle`/`accDescr`. Always place a descriptive _italic_ Markdown paragraph directly above the code block. --- ## Exemplar Diagram _Timeline of a startup's growth milestones from founding through Series A, organized by year and quarter:_ ```mermaid timeline title πŸš€ Startup Growth Milestones section 2024 Q1 : πŸ’‘ Founded : Built MVP Q2 : πŸ§ͺ Beta launch : 100 users Q3 : πŸ“ˆ Product-market fit : 1K users Q4 : πŸ’° Seed round : $2M raised section 2025 Q1 : πŸ‘₯ Team of 10 : Hired engineering lead Q2 : 🌐 Public launch : 10K users Q3 : 🏒 Enterprise tier : First B2B deal Q4 : πŸ“Š $1M ARR : Series A prep section 2026 Q1 : πŸš€ Series A : $15M raised ``` --- ## Tips - Use `section` to group by year, quarter, or phase - Each entry can have multiple items separated by `:` - Keep items concise β€” 2–4 words each - Emoji at the start of key items for visual anchoring - **Always** pair with a Markdown text description above for screen readers --- ## Template _Description of the timeline and the period it covers:_ ```mermaid timeline title πŸ“‹ Your Timeline Title section Period 1 Event A : Detail one : Detail two Event B : Detail three section Period 2 Event C : Detail four Event D : Detail five : Detail six ``` --- ## Complex Example _Multi-year technology platform evolution tracking a startup's journey from monolith through microservices to AI-powered platform. Six sections span 2020-2025, each capturing key technical milestones and business metrics that drove architecture decisions:_ ```mermaid timeline title πŸš€ Platform Architecture Evolution section 2020 β€” Monolith Era Q1 : πŸ’‘ Founded company : Rails monolith launched : 10 engineers Q3 : ⚠️ Hit scaling ceiling : 50K concurrent users : Database bottleneck section 2021 β€” Breaking Apart Q1 : πŸ” Extracted auth service : 🐳 Adopted Docker : CI/CD pipeline live Q3 : πŸ“¦ Split order processing : ⚑ Added Redis cache : 200K users section 2022 β€” Microservices Q1 : βš™οΈ 8 services in production : ☸️ Kubernetes migration : Service mesh pilot Q3 : πŸ“₯ Event-driven architecture : πŸ“Š Observability stack : 500K users section 2023 β€” Platform Maturity Q1 : 🌐 Multi-region deployment : πŸ›‘οΈ Zero-trust networking : 50 engineers Q3 : πŸ”„ Canary deployments : πŸ“ˆ 99.99% uptime SLA : 2M users section 2024 β€” AI Integration Q1 : 🧠 ML recommendation engine : ⚑ Real-time personalization Q3 : πŸ” AI-powered search : πŸ“Š Predictive analytics : 5M users section 2025 β€” Next Generation Q1 : ☁️ Edge computing rollout : πŸ€– AI agent platform : 10M users ``` ### Why this works - **6 sections are eras, not just years** β€” "Monolith Era", "Breaking Apart", "Microservices" tell the story of _why_ the architecture changed, not just _when_ - **Business metrics alongside tech milestones** β€” user counts and team size appear next to architecture decisions. This shows the _pressure_ that drove each evolution (50K users β†’ scaling ceiling β†’ extracted services) - **Multiple items per time point** β€” each quarter packs 2-3 items separated by `:`, giving a dense but scannable view of everything happening in parallel - **Emoji anchors the scan** β€” eyes land on 🧠 ML, 🌐 Multi-region, ⚑ Redis before reading the text. For a quick skim, the emoji alone tells the story