Generate SVG image like GitHub contribution graph (github-grass) with API.

You can configure the URL in the online editor with seeing preview.

Quick start

Markdown:

[![typograssy](https://typograssy.deno.dev/api?text=Hello%20world!)](https://github.com/kawarimidoll/typograssy)

HTML:

<a href="https://github.com/kawarimidoll/typograssy"><img alt="typograssy" src="https://typograssy.deno.dev/api?text=Hello%20world!"></a>

Features

⚙️ Configurable

See parameters section.

📜 Auto-scrolling

The pixels will scroll if the text can't be show at once.

💡 You should put 'trailing space' to the URL to separate the last character and the first one.

🇯🇵 Japanese support

You can check supported characters on characters.ts.

Parameters

⚠️ Follow the color value format when you change the colors.

text [required]

• type: string

The text that you want to show. It need to be less than 70 characters.

l0, l1, l2, l3, l4

• type: string
• default:
  • l0: ebedf0
  • l1: 9be9a8
  • l2: 40c463
  • l3: 30a14e
  • l4: 216e39

The color of the pixels. l0 is used as base color, the others are used as font color at random.

bg

• type: string
• default: ffffff

The color of the background.

frame

• type: string
• default: 000000

The color of the frame.

speed

• type: number
• default: 200

The speed of scrolling. 200 means that move 1 pixel per 200 milliseconds.

comment

• type: string
• default: Generated by kawarimidoll/typograssy

The comment on left bottom. It need to be less than 70 characters.

Color value format

• hex value without hash symbol. e.g. 000, 123abc.
• html color name. e.g. red, aqua.
• none.

Contribution

All contributions are welcome!

Develop

See defined tasks to run deno task.

Local run

deno task run

Format files

deno task fmt

Lint files

deno task lint

Run tests

deno task test

Related pages

• Runtime: Deno, Deno Deploy
• Font: 美咲フォント
• Style of GUI page: Water.css
• Inspired: Github Profile Trophy