Gatsby Themes

Ship and use chunks of Gatsby functionality as npm packages

Using a Gatsby theme, all of your default configuration is abstracted out of your site, and into an installable package. You can seamlessly update a theme, compose themes together, and even swap out one compatible theme for another.
discussion
Would you recommend this product?
9 Reviews5.0/5
Jamie Barton
Developer Experience Engineer
The potential of Gatsby themes is massive. Being able to ship self contained pieces of functionality in the method of themes, is genius. I for example could install a blog on my site by simply installing a package and setting the base path. Magic! While the above sounds great, it is important to remember that these themes will potentially ship with their own mountain of dependencies and individual styling frameworks. I'm super interested to see theme-ui grow, and if that becomes a standard, gatsby themes will need to adopt that standard to make it appealing for someone to 'plug and go". Gatsby themes + component shadowing though ❤️
Share
Christopher Biscardi
Maker
Independent Consultant
@notrab Hey thanks for the kind words :) Theme UI (https://theme-ui.com/) was definitely built to include with the best practices we've discovered while themes have been experimental, and this is why the official Gatsby themes take advantage of it. We hope that other people find it's approach useful when building their own themes as well. That's why we're driving standards like the token spec Theme UI implements (https://github.com/system-ui/the...) because it will enable more interop with design tools like having the ability to output a standardized set of tokens more directly into production workflows. That said, Theme UI will never be a hard requirement for working with themes because there are a number of use cases for which it doesn't make sense, such using themes as an "internal Create React App" like the Carbon Design System and Apollo teams have done.
Share
Jamie Barton
Developer Experience Engineer
@chrisbiscardi Keep up the great work. I for one will be keeping a close eye on the development, and excited to create some of my own content in the process while learning more about Gatsby/themes.
Share
Christopher Biscardi
Maker
Independent Consultant
Hey y'all, We built Gatsby themes to empower a wider range of people to build sites faster while focusing more on the important bits for their own use cases. We are seeing themes empower designers, marketers, and of course developers too in real world production use cases. It's not uncommon at this point to hear about a team on a tight deadline that used themes to meet that deadline and I'm super happy to have seen this through to a stable release. We've launched a couple official themes, gatsby-theme-blog and gatsby-theme-notes, that you can use to get a feel for what it's like to use themes before getting started on creating your own child themes or full fledged themes. Use the following command to check out both themes installed at the same time in a new site with some demo content: ``` npx gatsby new my-new-blog gatsbyjs/gatsby-starter-theme ``` I'll be hanging around throughout the day to answer anyone's questions :)
Share
Osamah AldoaissFrontend Developer
I have been using Gatsby Themes for the last 4 months and it has been a life-saver in terms of Development speed and Developer experience. Also the Gatsby team has been very responsive to questions. Gatsby by itself is already my top Framework for any kind of page I build.
Share
Hunter BectonDesign and Development at Skillthrive
I'm super excited about Gatsby Themes! I've been trying out some different Headless CMSs to see which one pairs well with theming. I found Prismic.io to have an interesting feature called Slices that allows you to create web pages with a drag and drop interface composed of components that you define.
Share
Ismail GhallouFull Stack JavaScript Developer
Love the idea of reusable themes, I was heading into the same end result with my Gatsby starters & reusable React components which most are published as npm packages, days after Gatsby themes were available, I went ahead & converted my dev portfolio starter into a theme, making it more customizable & easier to use, here's the link of the theme if anyone wants to try it out: https://www.npmjs.com/package/ga...
Share
Christopher Biscardi
Maker
Independent Consultant
@smakosh That's great :) How did you find the conversion process when going from a starter to a theme?
Share
Ismail GhallouFull Stack JavaScript Developer
@chrisbiscardi really smooth, the only headache was yarn workspaces but without them it's worse. I would give it a 8/10.
Share
Hunting down comments...