A Wardley Map positions components on a two-axis grid. The vertical axis shows visibility — how directly a component faces the user, from invisible infrastructure at the bottom to user-facing features at the top. The horizontal axis shows evolution — how mature or commodity a component is, from novel and custom-built on the left to standard utility on the right.
Wardley Maps are used in business strategy and technology planning to understand what is worth building versus buying, which components are likely to change, and where competitive advantage can be found. They were created by Simon Wardley.
This diagram type is experimental and requires Mermaid v11.14 or later.
wardley-beta title Blog Platform Value Chain anchor Reader [0.95, 0.90] anchor Author [0.90, 0.85] component "Published Content" [0.80, 0.75] component "Writing Tool" [0.65, 0.55] (buy) component "CMS" [0.55, 0.50] (buy) component "Hosting" [0.30, 0.80] (outsource) component "Search Engine Index" [0.20, 0.90] (market) Reader -> "Published Content" Author -> "Writing Tool" "Writing Tool" -> CMS CMS -> "Published Content" CMS -> Hosting Hosting -> "Search Engine Index" evolve "Writing Tool" 0.75 evolve Hosting 0.95 note "Commoditising fast — little advantage in building" [0.25, 0.65]
Components are placed using [visibility, evolution] coordinates (both 0.0–1.0). Dependencies are drawn with ->. The evolve keyword adds a dashed arrow showing where a component is expected to move as it matures.
```mermaid
wardley-beta
title Blog Platform Value Chain
anchor Reader [0.95, 0.90]
anchor Author [0.90, 0.85]
component "Published Content" [0.80, 0.75]
component "Writing Tool" [0.65, 0.55] (buy)
component "CMS" [0.55, 0.50] (buy)
component "Hosting" [0.30, 0.80] (outsource)
component "Search Engine Index" [0.20, 0.90] (market)
Reader -> "Published Content"
Author -> "Writing Tool"
"Writing Tool" -> CMS
CMS -> "Published Content"
CMS -> Hosting
Hosting -> "Search Engine Index"
evolve "Writing Tool" 0.75
evolve Hosting 0.95
note "Commoditising fast — little advantage in building" [0.25, 0.65]
```
For more Wardley map syntax see the Wardley map documentation at mermaid.js.org