diff --git a/demo/mdx.mdx b/demo/mdx.mdx
new file mode 100644
index 0000000..3ab3b6c
--- /dev/null
+++ b/demo/mdx.mdx
@@ -0,0 +1,31 @@
+import Comp from "./comp";
+
+# Night Owl Theme
+
+> Night Owl theme for VS Code.
+
+## Heading 2
+
+### Heading 3
+
+A **VS Code dark** theme for contrast for nighttime coding.
+
+import Comp from "./comp";
+
+export function Local(props) {
+  return <span style={{ color: "red" }} {...props} />;
+}
+
+![Preview](images/preview.gif)
+
+# Installation
+
+1.  Install [Visual Studio Code](https://code.visualstudio.com/)
+2.  Launch Visual Studio Code
+3.  Choose **Extensions** from menu
+4.  Search for `night-owl`
+5.  Click **Install** to install it
+6.  Click **Reload** to reload the Code
+7.  File > Preferences > Color Theme > **Night Owl**
+
+-[ ] check check 12 12 -[ ] check check 12 12
diff --git a/themes/Night Owl-Light-color-theme-noitalic.json b/themes/Night Owl-Light-color-theme-noitalic.json
index d122f33..5fd6464 100644
--- a/themes/Night Owl-Light-color-theme-noitalic.json	
+++ b/themes/Night Owl-Light-color-theme-noitalic.json	
@@ -1297,9 +1297,9 @@
     {
       "name": "Markdown Headings",
       "scope": [
-        "markup.heading.markdown",
-        "markup.heading.setext.1.markdown",
-        "markup.heading.setext.2.markdown"
+        "markup.heading",
+        "markup.heading.setext.1",
+        "markup.heading.setext.2"
       ],
       "settings": {
         "foreground": "#4876d6"
@@ -1307,7 +1307,7 @@
     },
     {
       "name": "Markdown Italics",
-      "scope": "markup.italic.markdown",
+      "scope": "markup.italic",
       "settings": {
         "foreground": "#994cc3",
         "fontStyle": "italic"
@@ -1315,7 +1315,7 @@
     },
     {
       "name": "Markdown Bold",
-      "scope": "markup.bold.markdown",
+      "scope": "markup.bold",
       "settings": {
         "foreground": "#4876d6",
         "fontStyle": "bold"
@@ -1323,24 +1323,21 @@
     },
     {
       "name": "Markdown Quote + others",
-      "scope": "markup.quote.markdown",
+      "scope": "markup.quote",
       "settings": {
         "foreground": "#697098"
       }
     },
     {
       "name": "Markdown Raw Code + others",
-      "scope": "markup.inline.raw.markdown",
+      "scope": "markup.inline.raw",
       "settings": {
         "foreground": "#0c969b"
       }
     },
     {
       "name": "Markdown Links",
-      "scope": [
-        "markup.underline.link.markdown",
-        "markup.underline.link.image.markdown"
-      ],
+      "scope": ["markup.underline.link", "markup.underline.link.image"],
       "settings": {
         "foreground": "#ff869a"
       }
diff --git a/themes/Night Owl-Light-color-theme.json b/themes/Night Owl-Light-color-theme.json
index 97b3d8f..5d2dc74 100644
--- a/themes/Night Owl-Light-color-theme.json	
+++ b/themes/Night Owl-Light-color-theme.json	
@@ -1339,9 +1339,9 @@
     {
       "name": "Markdown Headings",
       "scope": [
-        "markup.heading.markdown",
-        "markup.heading.setext.1.markdown",
-        "markup.heading.setext.2.markdown"
+        "markup.heading",
+        "markup.heading.setext.1",
+        "markup.heading.setext.2"
       ],
       "settings": {
         "foreground": "#4876d6"
@@ -1349,7 +1349,7 @@
     },
     {
       "name": "Markdown Italics",
-      "scope": "markup.italic.markdown",
+      "scope": "markup.italic",
       "settings": {
         "foreground": "#994cc3",
         "fontStyle": "italic"
@@ -1357,7 +1357,7 @@
     },
     {
       "name": "Markdown Bold",
-      "scope": "markup.bold.markdown",
+      "scope": "markup.bold",
       "settings": {
         "foreground": "#4876d6",
         "fontStyle": "bold"
@@ -1365,7 +1365,7 @@
     },
     {
       "name": "Markdown Quote + others",
-      "scope": "markup.quote.markdown",
+      "scope": "markup.quote",
       "settings": {
         "foreground": "#697098",
         "fontStyle": "italic"
@@ -1373,7 +1373,7 @@
     },
     {
       "name": "Markdown Raw Code + others",
-      "scope": "markup.inline.raw.markdown",
+      "scope": "markup.inline.raw",
       "settings": {
         "foreground": "#0c969b"
       }
@@ -1381,8 +1381,8 @@
     {
       "name": "Markdown Links",
       "scope": [
-        "markup.underline.link.markdown",
-        "markup.underline.link.image.markdown"
+        "markup.underline.link",
+        "markup.underline.link.image"
       ],
       "settings": {
         "foreground": "#ff869a"
diff --git a/themes/Night Owl-color-theme-noitalic.json b/themes/Night Owl-color-theme-noitalic.json
index 364454b..6e72b2d 100644
--- a/themes/Night Owl-color-theme-noitalic.json	
+++ b/themes/Night Owl-color-theme-noitalic.json	
@@ -1400,9 +1400,9 @@
     {
       "name": "Markdown Headings",
       "scope": [
-        "markup.heading.markdown",
-        "markup.heading.setext.1.markdown",
-        "markup.heading.setext.2.markdown"
+        "markup.heading",
+        "markup.heading.setext.1",
+        "markup.heading.setext.2"
       ],
       "settings": {
         "foreground": "#82b1ff"
@@ -1410,7 +1410,7 @@
     },
     {
       "name": "Markdown Italics",
-      "scope": "markup.italic.markdown",
+      "scope": "markup.italic",
       "settings": {
         "foreground": "#c792ea",
         "fontStyle": "italic"
@@ -1418,7 +1418,7 @@
     },
     {
       "name": "Markdown Bold",
-      "scope": "markup.bold.markdown",
+      "scope": "markup.bold",
       "settings": {
         "foreground": "#c5e478",
         "fontStyle": "bold"
@@ -1426,7 +1426,7 @@
     },
     {
       "name": "Markdown Quote + others",
-      "scope": "markup.quote.markdown",
+      "scope": "markup.quote",
       "settings": {
         "foreground": "#697098",
         "fontStyle": ""
@@ -1434,17 +1434,14 @@
     },
     {
       "name": "Markdown Raw Code + others",
-      "scope": "markup.inline.raw.markdown",
+      "scope": "markup.inline.raw",
       "settings": {
         "foreground": "#80CBC4"
       }
     },
     {
       "name": "Markdown Links",
-      "scope": [
-        "markup.underline.link.markdown",
-        "markup.underline.link.image.markdown"
-      ],
+      "scope": ["markup.underline.link", "markup.underline.link.image"],
       "settings": {
         "foreground": "#ff869a"
       }
diff --git a/themes/Night Owl-color-theme.json b/themes/Night Owl-color-theme.json
index 6d41b62..4b99449 100644
--- a/themes/Night Owl-color-theme.json	
+++ b/themes/Night Owl-color-theme.json	
@@ -1422,9 +1422,9 @@
     {
       "name": "Markdown Headings",
       "scope": [
-        "markup.heading.markdown",
-        "markup.heading.setext.1.markdown",
-        "markup.heading.setext.2.markdown"
+        "markup.heading",
+        "markup.heading.setext.1",
+        "markup.heading.setext.2"
       ],
       "settings": {
         "foreground": "#82b1ff"
@@ -1432,7 +1432,7 @@
     },
     {
       "name": "Markdown Italics",
-      "scope": "markup.italic.markdown",
+      "scope": "markup.italic",
       "settings": {
         "foreground": "#c792ea",
         "fontStyle": "italic"
@@ -1440,7 +1440,7 @@
     },
     {
       "name": "Markdown Bold",
-      "scope": "markup.bold.markdown",
+      "scope": "markup.bold",
       "settings": {
         "foreground": "#c5e478",
         "fontStyle": "bold"
@@ -1448,7 +1448,7 @@
     },
     {
       "name": "Markdown Quote + others",
-      "scope": "markup.quote.markdown",
+      "scope": "markup.quote",
       "settings": {
         "foreground": "#697098",
         "fontStyle": "italic"
@@ -1456,7 +1456,7 @@
     },
     {
       "name": "Markdown Raw Code + others",
-      "scope": "markup.inline.raw.markdown",
+      "scope": "markup.inline.raw",
       "settings": {
         "foreground": "#80CBC4"
       }
@@ -1464,8 +1464,8 @@
     {
       "name": "Markdown Links",
       "scope": [
-        "markup.underline.link.markdown",
-        "markup.underline.link.image.markdown"
+        "markup.underline.link",
+        "markup.underline.link.image"
       ],
       "settings": {
         "foreground": "#ff869a"