diff --git a/docs/usage/connectivity.md b/docs/usage/connectivity.md
new file mode 100644
index 0000000000000000000000000000000000000000..c187046f398fa66ee2c6ffe99276e219b48aaf2e
--- /dev/null
+++ b/docs/usage/connectivity.md
@@ -0,0 +1,81 @@
+# Exploring connectivity
+
+Powered by <https://github.com/FZJ-INM1-BDA/HBP-connectivity-component>, the interactive atlas viewer allows the exploration of connectivity of parcellation regions, based on datasets curated in HBP Knowledge Graph.
+
+Currently, connectivity data is explorable for the parcellation `JuBrain Cytoarchitectonic Atlas`, which is available in template spaces `MNI Colin 27` and `ICBM 2009c Nonlinear Asymmetric`.
+
+## Getting started
+
+- Select parcellation `JuBrain Cytoarchitectonic Atlas` and click on a region to bring up a context-specific menu
+
+ [](images/region_menu_with_connectivity.png)
+
+- Click the `Connectivity` button, available datasets for connectivity will be displayed
+
+ [](images/connectivity_dataset_menu.png)
+
+- Click on a dataset (e.g. `1000 Brain Study - DTI connectivity`) to explore the connectivity data associated with it.
+
+## Working with connectivity data
+
+Upon selecting a preview dataset, several aspects of the UI will change:
+
+- the color map of the parcellation will be replaced by a heat map, derived from the magnitutde of connectivity.
+
+ | Regular color map | Connectivity heat map |
+ | --- | --- |
+ | [](images/connectivity_color_before.png) | [](images/connectivity_color_after.png) |
+
+
+- a side panel will be opened, showing the tabulated data of the connectivity.
+
+ [](images/connectivity_data_main.png)
+
+
+### Tabulated side panel
+
+In the tabulated view, the selected dataset can be reviewed and changed.
+
+[](images/see_dataset_connectivity.png)
+
+[](images/connectivity_dataset_description.png)
+
+The source region is displayed in the tabulated view.
+
+[](images/connectivity_source_region.png)
+
+The magnitude of the connectivity can either be displayed linearly or logarithmically by toggling the `Log10` checkbox.
+
+| Connectivity plotted logarithmically `default` | Connectivity plotted linearly |
+| --- | --- |
+| [](images/con_diagram_log.png) | [](images/con_diagram_no_log.png) |
+
+The display of magnitude of the connectivity can also be toggled with `All results` checkbox.
+
+| Hiding magnitude `default` | Showing magnitude |
+| --- | --- |
+| [](images/conn_disabled_all.png) | [](images/conn_enabled_all.png) |
+
+Clicking on any of the connected region will reveal a region context menu. In addition to the full name of the region, two buttons are present:
+
+- `Navigate` - navigate to the region of interest.
+- `Connectivity` - to the region of interest as the source, and explore its connectivity with other parcellation regions.
+
+[](images/conn_expanded_area.png)
+
+### Export
+
+At the bottom of the side panel, `export` buttons can be found. The data can either be exported as a CSV or PNG.
+
+[](images/conn_export.png)
+
+## Exit
+
+To exit the connectivity mode, click the close button located at the top right side of the side panel.
+
+[](images/close_connectivity.png)
+
+Exiting the connectivity mode will:
+
+- restore the colour map of the parcellation
+- remove the connectivity side panel
diff --git a/docs/usage/images/close_connectivity.png b/docs/usage/images/close_connectivity.png
new file mode 100644
index 0000000000000000000000000000000000000000..a5dc58c5fec14f70d900d34407f6a94e9a0aba11
Binary files /dev/null and b/docs/usage/images/close_connectivity.png differ
diff --git a/docs/usage/images/con_diagram_log.png b/docs/usage/images/con_diagram_log.png
new file mode 100644
index 0000000000000000000000000000000000000000..fdcd530bc71b257f386b2c34c6f2c31ea95b937a
Binary files /dev/null and b/docs/usage/images/con_diagram_log.png differ
diff --git a/docs/usage/images/con_diagram_no_log.png b/docs/usage/images/con_diagram_no_log.png
new file mode 100644
index 0000000000000000000000000000000000000000..a7d7c76a38662b83c859aafed00768a2a6b2c58d
Binary files /dev/null and b/docs/usage/images/con_diagram_no_log.png differ
diff --git a/docs/usage/images/conn_disabled_all.png b/docs/usage/images/conn_disabled_all.png
new file mode 100644
index 0000000000000000000000000000000000000000..9f52d6f29e3dc911233c1609644f76f6e0bd94b8
Binary files /dev/null and b/docs/usage/images/conn_disabled_all.png differ
diff --git a/docs/usage/images/conn_enabled_all.png b/docs/usage/images/conn_enabled_all.png
new file mode 100644
index 0000000000000000000000000000000000000000..b44a78a5a01ddbfaabce9d26fd608351978be353
Binary files /dev/null and b/docs/usage/images/conn_enabled_all.png differ
diff --git a/docs/usage/images/conn_expanded_area.png b/docs/usage/images/conn_expanded_area.png
new file mode 100644
index 0000000000000000000000000000000000000000..f958647061a136b56d48002f87f5a68e22cd3e69
Binary files /dev/null and b/docs/usage/images/conn_expanded_area.png differ
diff --git a/docs/usage/images/conn_export.png b/docs/usage/images/conn_export.png
new file mode 100644
index 0000000000000000000000000000000000000000..172c5e3808934398cdadd83522add391233cec7e
Binary files /dev/null and b/docs/usage/images/conn_export.png differ
diff --git a/docs/usage/images/connectivity_color_after.png b/docs/usage/images/connectivity_color_after.png
new file mode 100644
index 0000000000000000000000000000000000000000..298f3b98bf756918d4ba4615c31390bc974f7032
Binary files /dev/null and b/docs/usage/images/connectivity_color_after.png differ
diff --git a/docs/usage/images/connectivity_color_before.png b/docs/usage/images/connectivity_color_before.png
new file mode 100644
index 0000000000000000000000000000000000000000..1dd9630b741361911d167bcfdf92b70256dcd182
Binary files /dev/null and b/docs/usage/images/connectivity_color_before.png differ
diff --git a/docs/usage/images/connectivity_data_main.png b/docs/usage/images/connectivity_data_main.png
new file mode 100644
index 0000000000000000000000000000000000000000..9272de593f85ca2882b5d58a4f746359129c271b
Binary files /dev/null and b/docs/usage/images/connectivity_data_main.png differ
diff --git a/docs/usage/images/connectivity_dataset_description.png b/docs/usage/images/connectivity_dataset_description.png
new file mode 100644
index 0000000000000000000000000000000000000000..770c96206e863a21bc30439f6e2c3fb85eb5ca11
Binary files /dev/null and b/docs/usage/images/connectivity_dataset_description.png differ
diff --git a/docs/usage/images/connectivity_dataset_menu.png b/docs/usage/images/connectivity_dataset_menu.png
new file mode 100644
index 0000000000000000000000000000000000000000..e0e271a4c9661b980ecc65efe70058e4e181ff73
Binary files /dev/null and b/docs/usage/images/connectivity_dataset_menu.png differ
diff --git a/docs/usage/images/connectivity_source_region.png b/docs/usage/images/connectivity_source_region.png
new file mode 100644
index 0000000000000000000000000000000000000000..caea6c4869cb99236234057a765b60917e6a066e
Binary files /dev/null and b/docs/usage/images/connectivity_source_region.png differ
diff --git a/docs/usage/images/region_menu_with_connectivity.png b/docs/usage/images/region_menu_with_connectivity.png
new file mode 100644
index 0000000000000000000000000000000000000000..2e683b6a491bb532952e68dc62244027cd3d436a
Binary files /dev/null and b/docs/usage/images/region_menu_with_connectivity.png differ
diff --git a/docs/usage/images/see_dataset_connectivity.png b/docs/usage/images/see_dataset_connectivity.png
new file mode 100644
index 0000000000000000000000000000000000000000..6584cf63f42aac07c179be7e913611cd8279474a
Binary files /dev/null and b/docs/usage/images/see_dataset_connectivity.png differ
diff --git a/mkdocs.yml b/mkdocs.yml
index 94f31ae2651b79ed5e7b352a06df26154ef9f8e8..ccd849296cf4db24d02a36f0f674a7b58b5ffe95 100644
--- a/mkdocs.yml
+++ b/mkdocs.yml
@@ -21,6 +21,7 @@ pages:
- Selecting: 'usage/selecting.md'
- Navigating: 'usage/navigating.md'
- Searching: 'usage/search.md'
+ - Exploring connectivity: 'usage/connectivity.md'
- Advanced usage:
- Keyboard shortcuts: 'advanced/keyboard.md'
- URL parsing: 'advanced/url.md'