Skip to main content

Documentation Index

Fetch the complete documentation index at: https://mintlify.com/apursley2012/color-melt/llms.txt

Use this file to discover all available pages before exploring further.

This page walks you through everything you need to go from zero to a live Color Melt portfolio. You will fork or download the theme, replace the starter content with your own information, upload the files to a GitHub repository with the correct structure, and then switch on GitHub Pages. The whole process requires no build tools, no Node.js, and no paid hosting — just a GitHub account and a code editor.
1

Download the Theme

Go to the Color Melt repository on GitHub:
https://github.com/apursley2012/color-melt
You have two options:
  • Fork the repository — Click Fork in the top-right corner of the page. This creates a copy of the repository under your own GitHub account and is the fastest path to a live site.
  • Download as a ZIP — Click Code → Download ZIP, extract the archive, and upload the files to a new repository of your own.
Whichever method you choose, confirm that the .nojekyll file is included at the root of your copy. This empty file is required — it tells GitHub Pages to serve the files directly instead of trying to process the project through Jekyll. Without it, the site’s styles and scripts may not load correctly.
2

Customize Your Content

Open index.html in a code editor and start by replacing the starter name, headline, and homepage introduction with your own information. This is the most visible part of the site and the best place to begin — the page should communicate who it belongs to before you change anything else.After updating the homepage, work through the pages in the pages/ folder. The recommended editing order from the README is:
  1. Name and homepage introduction — index.html
  2. About — pages/About.html
  3. Projects — pages/Projects.html
  4. Skills — pages/Skills.html
  5. Work history — pages/Work.html
  6. Writing — pages/Articles.html
  7. Screenshots — replace images in images/screenshots/
  8. Contact — pages/Contact.html
Following this order keeps the process manageable because the most visible content — your identity and featured work — is handled first. Update external profile links (GitHub, LinkedIn, résumé downloads) and replace any placeholder email addresses before you publish.To adjust colors, fonts, or spacing, edit assets/main.css. Make targeted changes rather than rewriting the whole stylesheet at once.
3

Upload to GitHub

Create a new repository on GitHub (or use your forked copy). When uploading, place the contents of the theme folder directly at the repository root so that index.html sits at the top level — not nested inside a subfolder.Correct structure:
your-repo/
├── .nojekyll
├── index.html
├── assets/
├── components/
├── pages/
└── images/
Incorrect structure (do not do this):
your-repo/
└── color-melt/
    ├── index.html
    └── assets/
The second layout creates an unnecessary folder layer. GitHub Pages looks for index.html at the root of the selected branch and folder, so nesting it inside a subfolder will result in a 404 page.To upload through the GitHub website: open the repository, select Add file → Upload files, drag in the extracted theme files and folders, confirm that index.html and .nojekyll both appear at the top level, add a commit message, and select Commit changes.
4

Enable GitHub Pages

Once your files are committed, turn on GitHub Pages:
  1. Open your repository on GitHub.
  2. Select Settings.
  3. Select Pages from the left sidebar.
  4. Under Build and deployment, set the source to Deploy from a branch.
  5. Choose the following options: 
    Branch: main
Folder: / (root)
  6. Select Save.
GitHub will build and publish the site. The first deployment can take a minute or two — refresh the Pages settings screen if the link does not appear immediately.Your published site URL will follow this format:
https://yourusername.github.io/repo-name/
Open the URL and verify that the homepage loads, navigation links work, images display, and the animated components appear as expected.
GitHub Pages paths are case-sensitive. Projects.html and projects.html are treated as different filenames. If a navigation link leads to a 404 page on the live site but works locally, check that the filename capitalization in your HTML links matches the actual filename exactly.

​
Test Before Sharing

Before you send your portfolio URL to anyone, run through this checklist to catch the most common issues:
Confirm that project screenshots, profile images, and any other visuals display without broken-image icons. If images are missing, check that the complete images/ folder was uploaded and that filenames and paths match exactly, including capitalization.
Open the live URL on a phone or use your browser’s responsive design mode to preview at mobile widths. Decorative components can affect spacing in ways that are more noticeable on smaller screens than in a desktop preview.
Check pages/Contact.html and confirm that all email addresses, GitHub links, LinkedIn links, and any downloadable résumé links have been replaced with your own current public information. Starter placeholder content on a live portfolio creates a poor first impression.
Open your repository on GitHub and confirm that .nojekyll is visible at the top level of the file list. It is an empty file and is supposed to look empty — its presence as a file is the instruction. If it is missing, add it by creating a new file named exactly .nojekyll with no extension and no content.

Build docs developers (and LLMs) love

Get started for freeTalk to us