Gatsby.js V2 starter combining React with HTML output
react-gatsby-starter-spectral — Gatsby Starter Template
By greyzor
A Gatsby.js V2 starter that ports the HTML5 UP Spectral site template into a React project.
Explore the design
Compare the page layouts and mobile experience. Open any screenshot for a closer look.
Actual screenshot captured by the server browser.
All pages & views 2
Screenshots show visual appearance; interactive behavior may differ.
What stands out
A quick read of the recorded project description.
Ports the HTML5 UP Spectral site template
Provides an online demo page to preview the result
README lists three to-dos: image sizing, animation preloading, and the menu bar
Repository is MIT-licensed and includes the standard license text
Template Details
This is a Gatsby.js V2 starter that integrates the Spectral site template designed by HTML5 UP into a React project. The author notes that it was inspired by the work of codebushi and other gatsby-starters. The repository provides an online demo (gatsby-spectral-demo.surge.sh), and after installation you can run gatsby develop from the command line to start the development site. The README's to-do list identifies three unfinished items: image sizing, animation preloading (the is-preload class), and the menu bar, indicating that the starter still has gaps in interaction and asset handling. The repository is MIT-licensed and was last updated in 2019.
Is it right for your project?
Use Cases
- A starting project for a Spectral-style static site
- Building showcase pages with Gatsby and React
- Reference code for learning the structure of a Gatsby starter
Suitable For
- Developers familiar with the basics of React and Gatsby
- Personal projects that want a quick start based on an HTML5 UP template
- Developers who need MIT-licensed code for further modification
Getting started & customization
Use these recorded setup notes alongside the repository instructions for your chosen version.
- 1
Install Gatsby first, then install this starter from the command line
- 2
Run gatsby develop in the terminal to start the development site
- 3
The README to-dos for image sizing, animation preloading, and the menu bar are unfinished and must be handled before use
- 4
Third-party assets such as demo images, fonts, and icons require separate license checks
License & source material
Usage conditions & limitations
Free to use · keep license noticeThis entry covers the free version under the MIT license in the public repository; the free scope applies to that version's code and does not mean external services or third-party assets are free.
Must comply with when using
- You may use, modify, commercially use, and distribute this version's code for free.
- When distributing copies or substantial portions of the code, retain the original author's copyright notice and the full MIT license notice.
- The code is provided as is; warranties and limitations of liability are governed by the original license and applicable law.
Additional costs & items to verify
- Demo images, fonts, icons, and other third-party assets must be checked against their own licenses and cannot be judged solely by the code's MIT license.
- External services such as domains, hosting, databases, payments, or AI may incur separate charges.
- This starter targets Gatsby.js V2 only; confirm compatibility with the Gatsby version you use before adopting it.
- The template is based on the Spectral site template designed by HTML5 UP; HTML5 UP assets usually have separate attribution and usage conditions that must be checked separately.
- The project was inspired by the work of codebushi and other gatsby-starters, so redistribution may require retaining the corresponding attribution.
- You must install the Gatsby environment yourself before use; this is an external tool dependency.
- The development site is started by running the gatsby develop command in the terminal.
- The README to-do list indicates that image sizing, animation preloading, and the menu bar are unfinished and must be handled before use.
View Original Text Basis
Permission is hereby granted, free of charge
Original License Text
**This is a starter for Gatsby.js V2.**
Original README
Gatsby.js V2 starter based on the Spectral site template, designed by HTML5 UP.
Original README
It has been inspired by the work from: github.com/codebushi and all here gatsby-starters.
Original README
Install this starter (assuming Gatsby is installed) by running from your CLI:
Original README
Run `gatsby develop` in the terminal to start the dev site.
Original README
https://github.com/greyzor/react-gatsby-starter-spectral/blob/master/LICENSEhttps://github.com/greyzor/react-gatsby-starter-spectral/blob/master/README.md+ Images sizing + Animation preloading (class 'is-preload') + Menubar
Original README
Compiled by DeepSeek based on repository license and README ·2026-10-13. Results only cover the materials read; dependencies, images, fonts, and subsequent term changes are subject to their respective original texts.
Project checks & description sources
Template Information
- Source platforms
- GitHub
- Documentation and maintenance reference score
- Partly documented · 70 / 100
- Technologies
- Gatsby · React · HTML
- Website type
- Starter
How this score is calculated
Our heuristic uses license records (up to 30), a demo link (12), a preview (10), stars (15), recorded maintenance (15), description completeness (8), feature records (5) and classification data (5). It is not a code, security or performance test, or a Google score. A link does not establish tested functionality.
What to verify for this project
- Repository update recorded
- 2019-05-16
- Screenshot last checked
- 2026-10-13
A demo link is listed. Check it with your own content and viewport sizes; its presence does not confirm that forms, authentication or payments work.
The catalog identifies Gatsby as the primary stack. Check the actual dependency manifest and lockfile for versions and hosting requirements. These notes use recorded metadata, not a code audit or a deployment test.
Use a selection guide →How this description was prepared
AI-assisted description based on catalog records and repository material. Repository authors are not automatically the reviewers of this description.
Review declaration: [email protected] · 2026-10-13
Inspect the recorded source material
SHA-256: 94375a2a0a8b4e59153326dc8113109b1ce0ad8c97d919ee1b76eda8b7c47594
2026-10-13T03:01:01.826Z
Source file / repository# gatsby-starter-spectral **This is a starter for Gatsby.js V2.** Gatsby.js V2 starter based on the Spectral site template, designed by HTML5 UP. It has been inspired by the work from: github.com/codebushi and all here gatsby-starters. ## Preview A demo is available here: [gatsby-spectral-demo.surge.sh](http://gatsby-spectral-demo.surge.sh) ## Installation Install this starter (assuming Gatsby is installed) by running from your CLI: Run `gatsby develop` in the terminal to start the dev site. ## Todo: + Images sizing + Animation preloading (class 'is-preload') + Menubar
Explore similar templates
Compare previews and descriptions within the same stack and category.

gatsby-starter-gcn
A Gatsby starter for building static blogs with Contentful and Netlify.
Gatsby · Blog

gatsby-starter-morning-dew
A Gatsby and React blog starter/theme that uses Markdown or MDX for posts, supports multilingual content, dark mode, tag grouping, PWA, and Disqus comments, and is MIT licensed.
Gatsby · Blog

starter-gatsby-blog
A community-maintained Gatsby blog starter for Contentful, with a simple content model, npm run setup import, Sync API support, and gatsby-plugin-image. Suitable for quickly building a CMS-driven static blog or learning Gatsby and Headless CMS integration.
Gatsby · 社区

automatic-gatsbyjs-app-landing-page
A GatsbyJS template for iOS app landing pages, ported from Emil Baehr's Automatic App Landing Page. Configure content in site-config.js without writing HTML or CSS, upload video previews or screenshots, and deploy via Netlify or build for GitHub Pages.
Gatsby · Tool Site

gatsby-starter-cv
A Gatsby and React starter for building a responsive personal digital resume. It includes sections for About, Skills, Job experiences, GitHub repositories, and Portfolio, with all personal data configured in data/siteConfig.js.
Gatsby · Starter

clay-theme
Clay is an image-centric Gatsby theme for publishers, portfolios, and photography blogs. It includes PWA support, a preconfigured Netlify/Decap CMS, PurgeCSS, Netlify deployment settings, and Netlify Forms.
Gatsby · Portfolio
