https://github.com/leviarista/github-profile-header-generator

A header image generator for your Github profile Readme
https://github.com/leviarista/github-profile-header-generator

banner-generator github github-banner github-header github-header-image github-profile github-profile-generator github-profile-header github-profile-header-generator github-profile-readme github-readme github-readme-profile hacktoberfest hacktoberfest2025 header-generator html2canvas image-generators vite

Last synced: 2 days ago
JSON representation

A header image generator for your Github profile Readme

• Host: GitHub
• URL: https://github.com/leviarista/github-profile-header-generator
• Owner: leviarista
• License: mit
• Created: 2022-02-27T16:48:35.000Z (almost 4 years ago)
• Default Branch: main
• Last Pushed: 2025-12-24T15:34:58.000Z (23 days ago)
• Last Synced: 2025-12-26T06:24:57.355Z (22 days ago)
• Topics: banner-generator, github, github-banner, github-header, github-header-image, github-profile, github-profile-generator, github-profile-header, github-profile-header-generator, github-profile-readme, github-readme, github-readme-profile, hacktoberfest, hacktoberfest2025, header-generator, html2canvas, image-generators, vite
• Language: HTML
• Homepage: https://leviarista.github.io/github-profile-header-generator/
• Size: 3.64 MB
• Stars: 1,143
• Watchers: 8
• Forks: 83
• Open Issues: 2
• Metadata Files:
  • Readme: README.md
  • Contributing: .github/CONTRIBUTING.md
  • License: LICENSE
  • Code of conduct: .github/CODE_OF_CONDUCT.md
  • Security: .github/SECURITY.md

Awesome Lists containing this project

• awesome-readme-tools - GitHub Profile Header Generator - A header image generator for your Github profile Readme. (Miscellaneous)
• awesome-github-profile - Github Profile Header Generator

README

          
  


# Github Profile Header Generator

## What is it?

A simple but nice header image generator for your __Github profile Readme__.  

You can use it for your __repo banners__ too!

[Create my banner!](https://leviarista.github.io/github-profile-header-generator/)

## How to use it?

1. Create a nice github header image.

2. Create your GitHub profile README following [this guide](https://docs.github.com/en/account-and-profile/setting-up-and-managing-your-github-profile/customizing-your-profile/managing-your-profile-readme).

3. Upload your header to your profile repo.

4. Add this line to your README:

   ```Markdown

   ![Header](./[Your header image])

   ```

## Examples

![Example 1](https://raw.githubusercontent.com/leviarista/github-profile-header-generator/main/social/examples/example-1.png)

![Example 2](https://raw.githubusercontent.com/leviarista/github-profile-header-generator/main/social/examples/example-2.png)

![Example 3](https://raw.githubusercontent.com/leviarista/github-profile-header-generator/main/social/examples/example-3.png)

![Example 4](https://raw.githubusercontent.com/leviarista/github-profile-header-generator/main/social/examples/example-4.png)

![Example 5](https://raw.githubusercontent.com/leviarista/github-profile-header-generator/main/social/examples/example-5.png)

## Features list

- Edit title and subtitle texts.

- Choose colors for text, background and borders.

- Set dimensions and padding.

- Align text and decorations.

- Change fonts.

- Set the size and radius of the border.

- Set background pattern image, its color, size and opacity.

- Add decorations.

- Upload your own decoration, octocat or profile pic.

- Toogle between Github dark and light mode.

- Download image as png.

- Choose from predefined presets or get a random one.

## Tech used

- [Vite](https://vitejs.dev/)

- [snapdom](https://zumerlab.github.io/snapdom/)

## Get started

- `npm run dev`- starts dev server

- `npm run build` - builds for production

- `npm run preview` - locally previews production build

## Get started with Docker

```bash

docker-compose up -d --build --force-recreate

```

## Contributing

Check out our [Contributing guide](https://github.com/leviarista/github-profile-header-generator/blob/main/.github/CONTRIBUTING.md)