Gatsby Starter Dimension is a Gatsby.js V2 starter template built on the Dimension site template designed by HTML5 UP, giving developers a pre-configured React project for a static website.
What is Gatsby Starter Dimension?
Gatsby Starter Dimension is a starter project for Gatsby.js V2, based on the Dimension site template originally designed by HTML5 UP. It is maintained by Codebushi and listed on their collection of Gatsby starters and themes. The repository includes a live preview at https://gatsby-dimension.surge.sh/ and an older v1 branch for the previous version of this starter.
Key Features
- Gatsby.js V2 foundation — The starter is built specifically for Gatsby version 2, offering static site generation with modern JavaScript tooling.
- HTML5 UP Dimension design — The visual layout and styling are derived from the Dimension template by HTML5 UP, adapted into React components for Gatsby.
- One-command setup — New projects can be created with
gatsby new gatsby-starter-dimension https://github.com/codebushi/gatsby-starter-dimension, no manual configuration required. - Live demo — The starter can be previewed online at https://gatsby-dimension.surge.sh/ before installation.
- Maintained by Codebushi — The starter is part of the Codebushi ecosystem, with more starters and themes available at https://codebushi.com/gatsby-starters-and-themes/.
- Version history — A v1 branch preserves the original Gatsby version for users who have not yet upgraded.
Who is it for?
Gatsby Starter Dimension is aimed at web developers who want to start a Gatsby project with a pre-built design instead of building the interface from scratch. It suits developers exploring Codebushi's starter collection and those who want a minimal static site based on the popular HTML5 UP Dimension aesthetic.
What can you do with it?
- Bootstrap a Gatsby site — Run the installation command to scaffold a new project with the Dimension design already wired up.
- Preview the template — Visit the hosted demo to evaluate the look and behavior before committing to the starter.
- Upgrade an existing site — Clone the repository and use the v1 branch to see changes between versions or to start from an older base.
- Customize for a portfolio — Use the starter's structure as a foundation to build a personal or project portfolio website, adapting the components as needed.
How does it work?
To get started, install the Gatsby CLI, then run gatsby new gatsby-starter-dimension https://github.com/codebushi/gatsby-starter-dimension from your terminal. After the setup finishes, navigate into the project directory and run gatsby develop to launch the development server. The site will be available locally at the default Gatsby address.
FAQ
How do I install Gatsby Starter Dimension?
Run gatsby new gatsby-starter-dimension https://github.com/codebushi/gatsby-starter-dimension using the Gatsby CLI, then cd gatsby-starter-dimension and run gatsby develop to start the development server.
What Gatsby version does this starter target?
It is specifically a starter for Gatsby.js V2. An older version for Gatsby V1 is preserved on the v1 branch of the repository.
Is there a live preview?
Yes, a hosted preview is available at https://gatsby-dimension.surge.sh/.
