Migrate to Netlify Today

Netlify announces the next evolution of Gatsby Cloud. Learn more

ContactSign Up
Official Plugin
View plugin on GitHub


The Gatsby Theme UI Preset

A Theme UI preset that contains the configuration used in other official Gatsby themes, e.g. gatsby-theme-blog. Styled with Gatsby’s brand colors.


For an existing site

If you already have a site you’d like to add the Theme UI theme to, you can manually configure it.

  1. Install the theme
npm install gatsby-theme-ui-preset
  1. Add the configuration to your gatsby-config.js file
module.exports = {
  plugins: [
      resolve: `gatsby-plugin-theme-ui`,
      options: {
        preset: `gatsby-theme-ui-preset`,
© 2023 Gatsby, Inc.