diff --git a/examples/nextjs-tailwind-mdx/.gitignore b/examples/nextjs-tailwind-mdx/.gitignore
new file mode 100644
index 00000000..1437c53f
--- /dev/null
+++ b/examples/nextjs-tailwind-mdx/.gitignore
@@ -0,0 +1,34 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+/.pnp
+.pnp.js
+
+# testing
+/coverage
+
+# next.js
+/.next/
+/out/
+
+# production
+/build
+
+# misc
+.DS_Store
+*.pem
+
+# debug
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# local env files
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
+
+# vercel
+.vercel
diff --git a/examples/nextjs-tailwind-mdx/README.md b/examples/nextjs-tailwind-mdx/README.md
new file mode 100644
index 00000000..24526844
--- /dev/null
+++ b/examples/nextjs-tailwind-mdx/README.md
@@ -0,0 +1,56 @@
+# Next.js + Tailwind CSS + MDX Starter Template
+
+A starter template for Next.JS with Tailwind and MDX. Intentionally limited feature-set to keep things simple. (If you want a more comprenhensive starter template check out https://github.com/timlrx/tailwind-nextjs-starter-blog).
+
+Includes instructions on how to rapidly customize the site.
+
+Preview online at https://nextjs-tailwind-mdx-tau.vercel.app
+
+## Features
+
+Pre-configured with the following;
+
+* Tailwind for easy styling. Booted off NextJS default tailwindcss example (https://github.com/vercel/next.js/tree/canary/packages/create-next-app)
+* Markdown / MDX rendering support. All markdown/MDX in `/content/` gets auto-rendered into the site.
+* Configurable e.g. site title etc (secret config in environment variables). See `Configuration` below.
+* Simple theming via `components/Layout.js`. Used to provide a standard them for all pages. Customizable NavBar and Footer with configurable nav links.
+* Analytics: Google analytics support following https://github.com/vercel/next.js/tree/canary/examples/with-google-analytics
+* SEO: basic SEO out of the box (via https://github.com/garmeeh/next-seo)
+
+## Usage
+
+Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
+
+```bash
+npx create-next-app --example https://github.com/datopian/nextjs-tailwind-mdx myapp
+# or
+yarn create next-app --example https://github.com/datopian/nextjs-tailwind-mdx myapp
+```
+
+Then run the app:
+
+```bash
+cd myapp
+npm run dev
+```
+
+## Configuration
+
+See `config` directory:
+
+* `config/siteConfig.js` for site wide configuration especially for general theme (e.g. title) and SEO
+* `config/navLinks.js` for configuration of navigation links
+
+### How to customize the content directory location?
+
+Open up `pages/[...slug].js` and change the `CONTENT_PATH` variable.
+
+### Theming
+
+We suggest the following:
+
+* Replace the favicon in `public/favicon.ico` or use the svg favicon ...
+* Add a logo: add image to `public` e.g. then open `components/layout.js` and replace footer logo link
+
+Tweaking the theme in general: open up `components/Layout.js` and tweak away.
+
diff --git a/examples/nextjs-tailwind-mdx/components/Layout.js b/examples/nextjs-tailwind-mdx/components/Layout.js
new file mode 100644
index 00000000..85762f1e
--- /dev/null
+++ b/examples/nextjs-tailwind-mdx/components/Layout.js
@@ -0,0 +1,37 @@
+import Link from 'next/link'
+import Head from 'next/head'
+import { NextSeo } from 'next-seo'
+
+import Nav from './Nav'
+import siteConfig from '../config/siteConfig'
+
+export default function Layout({ children, title='' }) {
+ return (
+ <>
+
+
+
+
+
+
+
+
+ {children}
+
+
+
+ )
+}
diff --git a/examples/nextjs-tailwind-mdx/components/MDX.js b/examples/nextjs-tailwind-mdx/components/MDX.js
new file mode 100644
index 00000000..13c019e2
--- /dev/null
+++ b/examples/nextjs-tailwind-mdx/components/MDX.js
@@ -0,0 +1,30 @@
+import { MDXRemote } from 'next-mdx-remote'
+import dynamic from 'next/dynamic'
+import Head from 'next/head'
+import Link from 'next/link'
+
+
+const components = {
+ Head,
+}
+
+export default function MdxPage({ children, source, frontMatter }) {
+ return (
+
+
+
+
{frontMatter.title}
+ {frontMatter.author && (
+
{frontMatter.author}
+ )}
+ {frontMatter.description && (
+
{frontMatter.description}
+ )}
+
+
+
+
+
+
+ )
+}
diff --git a/examples/nextjs-tailwind-mdx/components/Nav.js b/examples/nextjs-tailwind-mdx/components/Nav.js
new file mode 100644
index 00000000..ba4eea13
--- /dev/null
+++ b/examples/nextjs-tailwind-mdx/components/Nav.js
@@ -0,0 +1,83 @@
+import { Fragment } from 'react'
+import { Disclosure, Menu, Transition } from '@headlessui/react'
+import { BellIcon, MenuIcon, XIcon } from '@heroicons/react/outline'
+import Link from 'next/link'
+
+import siteConfig from '../config/siteConfig.js'
+import navLinks from '../config/navLinks.js'
+
+function classNames(...classes) {
+ return classes.filter(Boolean).join(' ')
+}
+
+export default function Nav() {
+ return (
+
+ {({ open }) => (
+ <>
+
+
+
+ {/* Mobile menu button */}
+
+ Open main menu
+ {open ? (
+
+ ) : (
+
+ )}
+
+