GatsbyReactHTMLStarter

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.

2 previews
Desktop homepage1 / 2
Desktop captureTop of page

Actual screenshot captured by the server browser.

All pages & views 2

Screenshots show visual appearance; interactive behavior may differ.

Recorded 2026-10-13View source

What stands out

A quick read of the recorded project description.

01

Gatsby.js V2 starter combining React with HTML output

02

Ports the HTML5 UP Spectral site template

03

Provides an online demo page to preview the result

04

README lists three to-dos: image sizing, animation preloading, and the menu bar

05

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.

GatsbyReactHTMLStarter

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. 1

    Install Gatsby first, then install this starter from the command line

  2. 2

    Run gatsby develop in the terminal to start the development site

  3. 3

    The README to-dos for image sizing, animation preloading, and the menu bar are unfinished and must be handled before use

  4. 4

    Third-party assets such as demo images, fonts, and icons require separate license checks

Read repository instructions

License & source material

Usage conditions & limitations

Free to use · keep license notice

This 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

+ Images sizing + Animation preloading (class 'is-preload') + Menubar

Original README
https://github.com/greyzor/react-gatsby-starter-spectral/blob/master/LICENSEhttps://github.com/greyzor/react-gatsby-starter-spectral/blob/master/README.md

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
Report a correction

Explore similar templates

Compare previews and descriptions within the same stack and category.