Movatterモバイル変換


[0]ホーム

URL:


Skip to content
DEV Community
Log in Create account

DEV Community

Cover image for ☘️ Growing 3D grass on Your GitHub Profile
Ryosuke
Ryosuke

Posted on

     

☘️ Growing 3D grass on Your GitHub Profile

I would like to introduceCGrass, which generates 3D grass images from GitHub Contributions. You can place the generated images in your Github Profile.CGrass runs on Github actions, so all you have to do is add a workflow and rewrite the README a bit.

↓ You can see the repository of this project at the following link

GitHub logo nrysk / cgrass

Contribution to 3D Grass

English |日本語

CGrass

If you like this project, please give it a star ⭐️

CGrass

CGrass is a GitHub contribution image generator that can integrate with GitHub Actions. It allows you to generate a 3D image of your GitHub contributions and set it in your profile README.

Getting Started

GitHub Actions

Copy the following code to your.github/workflows/cgrass.yml file in your profile repository.

name:Generate Picture and Push to output branchon:push:branches:            -mainschedule:        -cron:'0 0 * * *'# any time you wantpermissions:contents:writejobs:generate:runs-on:ubuntu-24.04steps:          -name:Checkoutuses:actions/checkout@v4          -name:Generate Pictureuses:nrysk/cgrass@v1.0.0with:github_username:${{ github.repository_owner }}github_token:${{ secrets.GITHUB_TOKEN }}output_path:output/output.pngcommand:"theme"argument:"github
Enter fullscreen modeExit fullscreen mode

How to UseCGrass

1. Create a Profile Page

Create a repository with the same name as your GitHub username.
If your GitHub username isnrysk, create a repository namednrysk.

2. Set Up the Workflow

Create a file named.github/workflows/cgrass.yml.

name:Generate Picture and Push to output branchon:push:branches:-mainschedule:-cron:'00***'# Adjust the time as desiredpermissions:contents:writejobs:generate:runs-on:ubuntu-24.04steps:-name:Checkoutuses:actions/checkout@v4-name:Generate Pictureuses:nrysk/cgrass@v1.0.0with:github_username:${{ github.repository_owner }}github_token:${{ secrets.GITHUB_TOKEN }}output_path:output/output.pngcommand:"theme"argument:"github"-name:Push output image to output branchuses:crazy-max/ghaction-github-pages@v4with:target_branch:outputbuild_dir:outputcommit_message:"GenerateOutputImage"env:GITHUB_TOKEN:${{ secrets.GITHUB_TOKEN }}
Enter fullscreen modeExit fullscreen mode

When you push (or Commit on GitHub), GitHub Actions will run. Once the Action completes, the generated image will be saved in the output branch.
If it encounters a segmentation fault, please rerun it.

3. Change the Theme

You can switch themes by modifying the string in the argument field.
I prepared 4 themes:github, github-nograss, planet, planet-nograss.

-name:Generate Pictureuses:nrysk/cgrass@v1.0.0with:github_username:${{ github.repository_owner }}github_token:${{ secrets.GITHUB_TOKEN }}output_path:output/output.pngcommand:"theme"argument:"github"# Change this part
Enter fullscreen modeExit fullscreen mode

github

github theme image

github-nograss

github-nograss theme image

planet

planet theme image

planet-nograss

planet-nograss theme image

4. Add the Image to Your Profile

To display the image in your profile’sREADME.md, add the following line and Replace<username> with your GitHub username.

![Contribution to Grass](https://raw.githubusercontent.com/<username>/<username>/refs/heads/output/output.png)
Enter fullscreen modeExit fullscreen mode

(Optional)

You can use a custom theme by creating a theme file. For more details, please refer toCGrass.


Thank you for reading

Top comments(0)

Subscribe
pic
Create template

Templates let you quickly answer FAQs or store snippets for re-use.

Dismiss

Are you sure you want to hide this comment? It will become hidden in your post, but will still be visible via the comment'spermalink.

For further actions, you may consider blocking this person and/orreporting abuse

  • Joined

Trending onDEV CommunityHot

DEV Community

We're a place where coders share, stay up-to-date and grow their careers.

Log in Create account

[8]ページ先頭

©2009-2025 Movatter.jp