Gatsby Theme Candor (Demo)

Gatsby Theme Candor is a simple and honest theme that will help you set up a production-grade website in no time.

Out of the box, it provides support for Typescript, MDX, and a custom theme built using the theme-ui spec. It also comes pre-configured to support a blog, frontmatter, syntax highlighting in code blocks, and responsive images.

Preview

Go to the Theme Preview page to see the theme in action!

Go to the Blog Index page to quickly find a list of all the pages in the demo site.

Installation

1. Install the theme

npm i --save @shetharp/gatsby-theme-candor
# or
yarn add @shetharp/gatsby-theme-candor

2. Add the theme to your gatsby-config.js files

// gatsby-config.js

module.exports = {
  plugins: ["@shetharp/gatsby-theme-candor"],
};

3. Create .mdx files on your src/pages and src/posts folders and you are all set.

// pages/index.mdx

---
title: Hello World! This is a frontmatter title.
author: Arlo Medi
date: 2020-07-30
---

# Hello World!

Lorem ipsum dolor sit amet.

Features

This Gatsby theme lets you easily set up a website with pages and blog posts from .mdx files.

• Pages are sourced from the src/pages directory
• Posts are sourced from the src/posts directory
• This is made possible with the gatsby-source-filesystem, gatsby-plugin-page-creator, and gatsby-plugin-mdx plugins

This theme also supports the following out of the box:

• Frontmatter querying and referencing from your MDX files
• Syntax highlighting in your MDX code blocks with gatsby-remark-prismjs
• Responsive optimized images with gatsby-remark-images and gatsby-plugin-sharp
• Theming with gatsby-plugin-theme-ui
• Type-checking with Typescript

Learn more about how this theme was developed: TODO