1.1.6 • Public • Published

Gatsby Modern Portfolio Theme

One file developer portfolios.

That's correct. Create your portfolio from just one markdown file.


  • Write a simple portfolio site from just one markdown file
  • change the site's ui with simple theming.
  • (coming soon): Deploy to netlify in one click.

Out of Scope

  • Ability to blog - hopefully this can be composed with another theme later.


  1. On a new repo install gatsby and this theme yarn add gatsby gatsby-theme-modern-portfolio -D
  2. Create agatsby-config.js file in the root
  3. Set the gatsby-theme-modern-portfolio in the __experimentalThemes option inside your gatsby-config.js
module.exports = {
  __experimentalThemes: [    {
    resolve: "gatsby-theme-modern-portfolio" ,
    options: {
      siteTitle: `Your site title`,
      siteDescription: `Here is a site title`,
  1. Create directory src/pages/markdown mkdir -p src/pages/markdown
  2. Create in src/pages/markdown and add the following to it
title: "John Doe"
subtitle: "My Website"
email: ""
linkedin: ""
textColor: 'black'
backgroundColor: '#e5f1f6'
fontUrl: '""'
fontFamily: 'Overlock, cursive;'

## Experience
- Building websites
  1. Add .cache and public to the repo's .gitignore file

  2. Run with yarn gatsby develop

  3. (coming soon): Deploy to netlify to see it live!

Selecting Fonts

  1. Select your chosen font from Google Fonts.
  2. Copy and paste the font url to
  3. Copy and paste the fontFamily to *Make sure to remove the quotation marks so that font-family: 'Overlock', cursive; becomes fontFamily: 'Overlock, cursive


  • Easily deploy to netlify.
  • ability to add a favicon
  • integrate with netlify-cms (this can come a bit later because the "cms" is very easy with one file!)

With thanks to:

  • These two great working examples of themes.
  • The Gatsby team to great documentation, and their default starter from which this project was initially based off.
  • For this (WHERE) website for the style inspiration.


npm i gatsby-theme-modern-portfolio

DownloadsWeekly Downloads






Unpacked Size

191 kB

Total Files


Last publish


  • mrjavascripter