Gatsby Starter Elemental

screenshot of Gatsby Starter Elemental

Gatsby Starter Elemental

Gatsby starter for portfolio sites


Gatsby Starter Elemental is a portfolio template designed for artists, photographers, and designers. It allows users to create blog, portfolio, and miscellaneous posts like privacy policies. The starter provides the flexibility to customize various features through configuration files. It also supports the creation of grids for portfolio pages and includes a contact form that can be customized.


  • Portfolio Template: Suitable for artists, photographers, and designers.
  • Blog and Miscellaneous Posts: Users can create blog posts and other miscellaneous posts like privacy policies.
  • Configurable: Most features of this starter are editable through the config.js file.
  • Grids for Portfolio Pages: Portfolio pages support the creation of grids with equal width on wide screens and expanding columns on smaller screens.
  • Contact Form: The theme includes a contact form that can be customized. Users can define data sent to the server and execute callback functions on response.


To use Gatsby Starter Elemental, follow these steps:

  1. Install Node.js and Gatsby if not already installed.
  2. Clone the project repository.
  3. Start the project by running the necessary commands.
  4. Configure the starter by editing the config.js file.
  5. Customize the blog, portfolio, and miscellaneous posts by creating new folders and files according to the provided structure.
  6. Customize the contact form by editing the contactFormSubmit and beforeContactFormSubmit functions in the config.js file.
  7. Contribute to the project by bumping the version and creating a pull request.


Gatsby Starter Elemental is a versatile portfolio template designed for artists, photographers, and designers. It offers features such as blog and portfolio post creation, configurable options, and the ability to create grids for portfolio pages. The theme also includes a customizable contact form. By following the installation guide and customizing the necessary files, users can easily set up and personalize their portfolio website using Gatsby Starter Elemental. Contributions to the project are also welcome.


GatsbyJS is a free and open-source static site generator based on React. It uses a modern development stack including Webpack, GraphQL, and modern JavaScript and CSS frameworks. It also provides a rich set of plugins, starters, and themes.


React is a widely used JavaScript library for building user interfaces and single-page applications. It follows a component-based architecture and uses a virtual DOM to efficiently update and render UI components


Tailwind CSS is a utility-first CSS framework that provides pre-defined classes for building responsive and customizable user interfaces.


MDX is a format that allows developers to write JSX within Markdown documents, combining the power of React with the simplicity of Markdown. This allows for the creation of dynamic and interactive content that can be easily shared and consumed across different platforms and devices.


TypeScript is a superset of JavaScript, providing optional static typing, classes, interfaces, and other features that help developers write more maintainable and scalable code. TypeScript's static typing system can catch errors at compile-time, making it easier to build and maintain large applications.