Skip to content
A boilerplate setup for VuePress with Tailwind CSS
Branch: master
Clone or download
Latest commit 387d71a Mar 14, 2019
Type Name Latest commit message Commit time
Failed to load latest commit information.
.vuepress Install Tailwind and PurgeCSS through VuePress Plugin Mar 14, 2019
package-lock.json 1.1.0 Mar 14, 2019
vuepress-tailwind.png Include a header image Feb 6, 2019

VuePress Tailwind Starter Theme

VuePress Tailwind Starter Theme

This boilerplate repository is designed to serve as a starting point for creating custom websites with VuePress. Because it replaces the original theme entirely, a lot of out-of-the-box functionality you get with the default VuePress installation is not available.

You can preview the live demo for this Github Repo hosted on Netlify.

PurgeCSS is used during the build process to keep the CSS bundle size as small as possible.

Why VuePress

The reason for using VuePress over other platforms like Nuxt or Jigsaw is because VuePress offers a way to keep your content primarily in Markdown whilst providing a super lightweight tooling setup. It provides server side rendering (SSR) for search engine optimisation (SEO) and can easily be used with services like Netlify to automate the build and deployment process. Finally, you get the full power of Vue.js to build out any advanced functionality, even inside Markdown files.

How to use this starter theme

Clone the repository

git clone my-project

Re-initialise the git repository

cd my-project && rm -Rf .git && git init

Building for development

Run the project and access the site via http://localhost:8080

npm run dev

Building for production

npm run build


  • Fix dev build to run without Purge Css
  • Import Tailwind and Purge CSS through VuePress Plugins
  • Compile into regular installable VuePress theme. Challenge will be the Tailwind config (also waiting for 1.0)
  • Add more out of the box functionality like Nav and Search


Any contributions to this package are welcome. Look me up on Twitter @m2de_io, I'd love to hear from anyone with feedback and see what you have created using VuePress and Tailwind.

You can’t perform that action at this time.
You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session.