Skip to content
play

GitHub Action

generate-snake-game-from-github-contribution-grid-extended

v0.4.0 Latest version

generate-snake-game-from-github-contribution-grid-extended

play

generate-snake-game-from-github-contribution-grid-extended

Generates a snake game from a github user contributions grid. Output the animation as gif or svg

Installation

Copy and paste the following snippet into your .yml file.

              

- name: generate-snake-game-from-github-contribution-grid-extended

uses: ArthurLobopro/[email protected]

Learn more about this action in ArthurLobopro/snk

Choose a version

snk

GitHub Workflow Status GitHub release GitHub marketplace type definitions code style

Generates a snake game from a GitHub user contributions graph

github contribution grid snake animation

Pull a github user's contribution graph. Make it a snake Game, generate a snake path where the cells get eaten in an orderly fashion.

Generate a gif or svg image.

Available as github action. It can automatically generate a new image each day. Which makes for great github profile readme

Usage

github action

- uses: ArthurLobopro/snk@v0
  with:
    # github user name to read the contribution graph from (**required**)
    # using action context var `github.repository_owner` or specified user
    github_user_name: ${{ github.repository_owner }}

    # list of files to generate.
    # one file per line. Each output can be customized with options as query string.
    #
    #  supported options:
    #  - palette:     A preset of color, one of [github, github-dark, github-light]
    #  - color_snake: Color of the snake
    #  - color_dots:  Coma separated list of dots color.
    #                 The first one is 0 contribution, then it goes from the low contribution to the highest.
    #                 Exactly 5 colors are expected.
    #  - hide_stack: If should hide progressbar, by default is false
    #  - dot_shape: The shape of the contribution dots,
    #               must be one of [square, square-rounded, circle].
    #               By default is square-rounded.
    #  - speed: The speed of animation, must be one of [fast, normal, slow].
    #           By default is normal
    #  - snake_size: The size of the snake, must be a number between 1 and 6.
    #                By default is 4.

    outputs: |
      dist/github-snake.svg
      dist/github-snake-dark.svg?palette=github-dark
      dist/ocean.gif?color_snake=orange&color_dots=#bfd6f6,#8dbdff,#64a1f4,#4b91f1,#3c7dd9

example with cron job

If you are only interested in generating a svg, consider using this faster action: uses: ArthurLobopro/snk/svg-only@v0

dark mode

For dark mode support on github, use this special syntax in your readme.

<picture>
  <source media="(prefers-color-scheme: dark)" srcset="github-snake-dark.svg" />
  <source media="(prefers-color-scheme: light)" srcset="github-snake.svg" />
  <img alt="github-snake" src="github-snake.svg" />
</picture>

interactive demo

platane.github.io/snk

local

npm install

npm run dev:demo

Implementation

solver algorithm