diff --git a/src/v2/guide/instance.md b/src/v2/guide/instance.md
index 94ee82319c..f3e0f62e0b 100644
--- a/src/v2/guide/instance.md
+++ b/src/v2/guide/instance.md
@@ -22,13 +22,13 @@ A Vue application consists of a **root Vue instance** created with `new Vue`, op
 
 ```
 Root Instance
-|- TodoList
-   |- TodoItem
-      |- DeleteTodoButton
-      |- EditTodoButton
-   |- TodoListFooter
-      |- ClearTodosButton
-      |- TodoListStatistics
+└─ TodoList
+   ├─ TodoItem
+   │  ├─ DeleteTodoButton
+   │  └─ EditTodoButton
+   └─ TodoListFooter
+      ├─ ClearTodosButton
+      └─ TodoListStatistics
 ```
 
 We'll talk about [the component system](components.html) in detail later. For now, just know that all Vue components are also Vue instances, and so accept the same options object (except for a few root-specific options).
diff --git a/src/v2/guide/migration.md b/src/v2/guide/migration.md
index 2817f43644..60c4ba7e8f 100644
--- a/src/v2/guide/migration.md
+++ b/src/v2/guide/migration.md
@@ -796,9 +796,9 @@ For example, let's say we have a todo app structured like this:
 
 ```
 Todos
-|-- NewTodoInput
-|-- Todo
-    |-- DeleteTodoButton
+├─ NewTodoInput
+└─ Todo
+   └─ DeleteTodoButton
 ```
 
 We could manage communication between components with this single event hub: