Awesome

Want your project to stand out? Socialify helps you showcase your project to the world by generating a beautiful project image like the one above!

It includes a ton of options including custom logo, description, badges, and many fonts and background patterns to choose from.

Join today!

Usage

Project site: https://socialify.git.ci

Social Image as a Service

Click on the image to use the link anywhere, the image will be programmatically generated with live data. This means the badges will automatically update.

Recommended for README files or img tags.

Image Download

You can download the image as a .png, .jpeg or .webp and use it anywhere in the world!

Recommended for GitHub repository social preview image and other sites that require image upload.

CLI

You can use cli tool mheap/github-social-image to upload social images to all your repos at once.

Examples

<p align="center"> <a href="https://socialify.git.ci/MLH-Fellowship/event-bot?description=1&font=Bitter&forks=0&issues=0&language=1&logo=https%3A%2F%2Fgist.githack.com%2Fwei%2F13e3f6e161cb1d0709abd847102dc80c%2Fraw%2Fmlh-color-square.svg&owner=0&pattern=Circuit%20Board&pulls=0&stargazers=0&theme=Light"> <img width="410" alt="Session Bot Example" src="https://socialify.git.ci/MLH-Fellowship/event-bot/image?description=1&font=Bitter&forks=0&issues=0&language=1&logo=https%3A%2F%2Fgist.githack.com%2Fwei%2F13e3f6e161cb1d0709abd847102dc80c%2Fraw%2Fmlh-color-square.svg&owner=0&pattern=Circuit%20Board&pulls=0&stargazers=0&theme=Light" /> </a> <a href="https://socialify.git.ci/MLH-Fellowship/class-photo?font=Inter&logo=https%3A%2F%2Favatars0.githubusercontent.com%2Fu%2F65834464%3Fs%3D200%26v%3D4&owner=1&pattern=Diagonal%20Stripes&stargazers=0&theme=Dark"> <img width="410" alt="Class Photo Example" src="https://socialify.git.ci/MLH-Fellowship/class-photo/image?font=Inter&logo=https%3A%2F%2Favatars0.githubusercontent.com%2Fu%2F65834464%3Fs%3D200%26v%3D4&owner=1&pattern=Diagonal%20Stripes&stargazers=0&theme=Dark" /> </a> <a href="https://socialify.git.ci/modfy/videotranscode.space?description=1&forks=1&issues=1&language=1&logo=https%3A%2F%2Fuser-images.githubusercontent.com%2F5880908%2F199906693-240ebfdf-5981-4018-a5ce-3dacd3a44536.png&pattern=Plus&pulls=1&stargazers=1&theme=Dark"> <img width="410" alt="Modfy Example" src="https://socialify.git.ci/modfy/videotranscode.space/image?description=1&forks=1&issues=1&language=1&logo=https%3A%2F%2Fuser-images.githubusercontent.com%2F5880908%2F199906693-240ebfdf-5981-4018-a5ce-3dacd3a44536.png&pattern=Plus&pulls=1&stargazers=1&theme=Dark" /> </a> <a href="https://socialify.git.ci/wei/pull?description=1&font=Source%20Code%20Pro&forks=1&language=1&logo=https%3A%2F%2Fgist.githack.com%2Fwei%2F40d98877c6ac5f917d78ccfe72a0f928%2Fraw%2Fpull-18h.svg&pattern=Floating%20Cogs&stargazers=1&owner=1&theme=Light"> <img width="410" alt="Pull Example" src="https://socialify.git.ci/wei/pull/image?description=1&font=Source%20Code%20Pro&forks=1&language=1&logo=https%3A%2F%2Fgist.githack.com%2Fwei%2F40d98877c6ac5f917d78ccfe72a0f928%2Fraw%2Fpull-18h.svg&pattern=Floating%20Cogs&stargazers=1&owner=1&theme=Light" /> </a> <a href="https://socialify.git.ci/traefik/traefik?description=1&font=Rokkitt&forks=1&logo=https%3A%2F%2Fpbs.twimg.com%2Fmedia%2FCcZdW37UcAA9DZz%3Fformat%3Dpng%26name%3Dsmall&owner=0&pattern=Signal&pulls=1&stargazers=1&owner=1&theme=Light"> <img width="410" alt="Traefik Example" src="https://socialify.git.ci/traefik/traefik/image?description=1&font=Rokkitt&forks=1&logo=https%3A%2F%2Fpbs.twimg.com%2Fmedia%2FCcZdW37UcAA9DZz%3Fformat%3Dpng%26name%3Dsmall&owner=0&pattern=Signal&pulls=1&stargazers=1&owner=1&theme=Light" /> </a> <a href="https://socialify.git.ci/facebook/react?description=1&font=Bitter&language=0&logo=data%3Aimage%2Fsvg%2Bxml%3Bbase64%2CPHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9Ii0xMS41IC0xMC4yMzE3NCAyMyAyMC40NjM0OCI%2BCiAgPHRpdGxlPlJlYWN0IExvZ288L3RpdGxlPgogIDxjaXJjbGUgY3g9IjAiIGN5PSIwIiByPSIyLjA1IiBmaWxsPSIjNjFkYWZiIi8%2BCiAgPGcgc3Ryb2tlPSIjNjFkYWZiIiBzdHJva2Utd2lkdGg9IjEiIGZpbGw9Im5vbmUiPgogICAgPGVsbGlwc2Ugcng9IjExIiByeT0iNC4yIi8%2BCiAgICA8ZWxsaXBzZSByeD0iMTEiIHJ5PSI0LjIiIHRyYW5zZm9ybT0icm90YXRlKDYwKSIvPgogICAgPGVsbGlwc2Ugcng9IjExIiByeT0iNC4yIiB0cmFuc2Zvcm09InJvdGF0ZSgxMjApIi8%2BCiAgPC9nPgo8L3N2Zz4K&owner=0&pattern=Formal%20Invitation&pulls=1&stargazers=1&theme=Dark"> <img width="410" alt="React Example" src="https://socialify.git.ci/facebook/react/image?description=1&font=Bitter&language=0&logo=data%3Aimage%2Fsvg%2Bxml%3Bbase64%2CPHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9Ii0xMS41IC0xMC4yMzE3NCAyMyAyMC40NjM0OCI%2BCiAgPHRpdGxlPlJlYWN0IExvZ288L3RpdGxlPgogIDxjaXJjbGUgY3g9IjAiIGN5PSIwIiByPSIyLjA1IiBmaWxsPSIjNjFkYWZiIi8%2BCiAgPGcgc3Ryb2tlPSIjNjFkYWZiIiBzdHJva2Utd2lkdGg9IjEiIGZpbGw9Im5vbmUiPgogICAgPGVsbGlwc2Ugcng9IjExIiByeT0iNC4yIi8%2BCiAgICA8ZWxsaXBzZSByeD0iMTEiIHJ5PSI0LjIiIHRyYW5zZm9ybT0icm90YXRlKDYwKSIvPgogICAgPGVsbGlwc2Ugcng9IjExIiByeT0iNC4yIiB0cmFuc2Zvcm09InJvdGF0ZSgxMjApIi8%2BCiAgPC9nPgo8L3N2Zz4K&owner=0&pattern=Formal%20Invitation&pulls=1&stargazers=1&theme=Dark" /> </a> </p>

Development

Create a GitHub token from Settings > Developer settings > Personal access tokens, you'll need it in when setting up environemnt variables.
You'll need the repo scope

Run the following commands to set up the Development server:

# Clone
git clone https://github.com/wei/socialify.git && cd $_

# Set environment variables in .env
cp .env.example .env

yarn install
yarn build
yarn dev

Authors

Part of @MLH-Fellowship Pod 1.0.6

License

MIT

Hosting

<a href="https://www.netlify.com"> <img width="114" height="50" alt="Deploys by Netlify" src="https://www.netlify.com/v3/img/components/netlify-dark.svg" /> </a>

SLA

Socialify is under active development. Design and project domain are subject to change without notice.

Please subscribe to #47 if you would like to receive service updates.

Consider downloading the images or self-hosting should this be a problem.

Privacy

Socialify does not collect any personal or identifiable information, we do not use cookies, do not collect emails or anything.

Socialify uses Google Analytics on web pages to understand overall usage. Generated image links do not have any tracking.