diff --git a/README.md b/README.md
index e45ae6c..4fe66bd 100644
--- a/README.md
+++ b/README.md
@@ -9,7 +9,11 @@ Renders ArchiMate 3.0 Open Exchange Format XML with layered layout:
 
 Supports all 8 ArchiMate relationship types with correct arrow notation.
 
-![anywidget-archimate demo](assets/demo.png)
+<picture>
+  <source media="(prefers-color-scheme: dark)" srcset="assets/demo-dark.png">
+  <source media="(prefers-color-scheme: light)" srcset="assets/demo-light.png">
+  <img alt="anywidget-archimate demo" src="assets/demo-light.png">
+</picture>
 
 ## Install
 
diff --git a/assets/archimate-dark.png b/assets/archimate-dark.png
new file mode 100644
index 0000000..9d3aa91
Binary files /dev/null and b/assets/archimate-dark.png differ
diff --git a/assets/archimate-light.png b/assets/archimate-light.png
new file mode 100644
index 0000000..debc825
Binary files /dev/null and b/assets/archimate-light.png differ
diff --git a/assets/demo.png b/assets/demo.png
deleted file mode 100644
index 42671b3..0000000
Binary files a/assets/demo.png and /dev/null differ