Markdown Buttons

A collection of SVG buttons for displaying custom "buttons" in Markdown content. You are free to use these buttons wherever you like. All buttons were created in Figma, with (most) icons provided by the Iconify plugin.

The SVG files can be found on this gist. They have been separated in order to reduce the amount of lag when loading this README file.

Important Notes

If you have linked to the Twitter button, it'll automatically update to show the X logo. If you would like to continue using the Twitter logo, please use the Twitter (Legacy) icon instead.

Linking to Buttons

To link to a button, use the following URL, replacing "SERVICE" with the service name (see services table below). Additionally, some buttons have animated, icon and compact variants, which can be accessed by appending either -animated, -compact or -icon to the service name.

https://gist.github.com/cxmeel/0dbc95191f239b631c3874f4ccf114e2/raw/SERVICE.svg

Embedding in Markdown

Use standard markdown formatting to embed these buttons. For example, to create a button that proceeds to a link when clicked, use the following format:

[![Get it on SERVICE](https://gist.github.com/cxmeel/0dbc95191f239b631c3874f4ccf114e2/raw/SERVICE.svg)](https://example.com/...)

Resizing

Services like Discourse allow for markdown images to be resized. This is especially useful when you want to create a row of buttons that include compact-style and icon buttons. Compact buttons are 32px height. You can use this to create small icon buttons using the following syntax:

[![Get it on SERVICE|32x32](https://gist.github.com/cxmeel/0dbc95191f239b631c3874f4ccf114e2/raw/SERVICE-icon.svg)](https://example.com/...)

Other services, like GitHub, may require you to use HTML instead. Usually you can mix <img /> tags with markdown syntax:

[<img src="https://gist.github.com/cxmeel/0dbc95191f239b631c3874f4ccf114e2/raw/SERVICE-icon.svg" alt="Get it on SERVICE" height="32" />](https://example.com/...)

Examples

Service Name	Variant Name	URL suffix
`roblox_dev`		`roblox_dev.svg`
`roblox_dev`	`-icon`	`roblox_dev-icon.svg`
`roblox_dev`	`-compact`	`roblox_dev-compact.svg`
`roblox_dev`	`-animated`	`roblox_dev-animated.svg`

Services

Services are now grouped alphabetically. You can use the list below to quickly jump to a letter.

A	B	C	D	E	F	G	H	I
J	K	L	M	N	O	P	Q	R
S	T	U	V	W	X	Y	Z	0
1	2	3	4	5	6	7	8	9

B

Service Name	Caption	Default (Large)	Compact	Icon	Animated
`behance`	FOLLOW	✔️	✔️	✔️	❌
`bitbucket`	GET IT ON	✔️	✔️	✔️	❌
`bitbucket_source`	SOURCE	✔️	❌	❌	❌

C

Example	Service Name	Caption	Default (Large)	Compact	Icon	Animated
	`crates_io`	GET IT ON	✔️	✔️	✔️	❌

D

Service Name	Caption	Default (Large)	Compact	Icon	Animated
`discord`	JOIN US	✔️	✔️	✔️	❌
`documentation`		✔️	✔️	✔️	❌
`docs`		✔️	✔️	❌	❌
`documentation_learn`	DOCUMENTATION	✔️	❌	❌	❌
`download`		✔️	✔️	✔️	❌
`dribbble`	FOLLOW	✔️	✔️	✔️	❌

F

Service Name	Caption	Default (Large)	Compact	Icon	Animated
`facebook`	JOIN US	✔️	✔️	✔️	❌
`facebook_like`	LIKE ON	✔️	❌	❌	❌
`figma_blue`	GET IT ON	✔️	✔️	✔️	❌
`figma_green`	GET IT ON	✔️	✔️	✔️	❌
`figma_purple`	GET IT ON	✔️	✔️	✔️	❌
`figma_red`	GET IT ON	✔️	✔️	✔️	❌

G

Service Name	Caption	Default (Large)	Compact	Icon	Animated
`github`	GET IT ON	✔️	✔️	✔️	❌
`github_source`	SOURCE	✔️	❌	❌	❌
`github_sponsor`	GitHub	✔️	✔️	✔️	❌
`gitlab`	GET IT ON	✔️	✔️	✔️	❌
`gitlab_source`	SOURCE	✔️	❌	❌	❌
`guilded`	JOIN US	✔️	✔️	✔️	❌

I

Example	Service Name	Caption	Default (Large)	Compact	Icon	Animated
	`instagram`	FOLLOW	✔️	✔️	✔️	❌
	`itch`	GET IT ON	✔️	✔️	✔️	❌

L

Example	Service Name	Caption	Default (Large)	Compact	Icon	Animated
	`lua`		✔️	✔️	✔️	❌
	`luau`		✔️	✔️	✔️	❌

M

Example	Service Name	Caption	Default (Large)	Compact	Icon	Animated
	`mastodon`	FOLLOW	✔️	✔️	✔️	❌

N

Example	Service Name	Caption	Default (Large)	Compact	Icon	Animated
	`npm`	GET IT ON	✔️	✔️	✔️	❌

P

Example	Service Name	Caption	Default (Large)	Compact	Icon	Animated
	`patreon`	SUPPORT	✔️	✔️	✔️	❌
	`play`		✔️	✔️	✔️	❌

R

Service Name	Caption	Default (Large)	Compact	Icon	Animated
`roblox`	GET IT ON	✔️	✔️	✔️	❌
`roblox_play`	PLAY ON	✔️	❌	❌	❌
`roblox_join`	JOIN ON	✔️	❌	❌	❌
`roblox_dev`	GET IT ON	✔️	✔️	✔️	✔️
`roblox_dev_creator_store`		✔️	✔️	❌	❌
`roblox_dev_marketplace`		✔️	✔️	❌	❌
`roblox_dev_store`		✔️	✔️	❌	❌
`roblox_dev_play`	PLAY ON	✔️	❌	❌	❌
`roblox_dev_join`	JOIN ON	✔️	❌	❌	❌
`roblox_ts`		✔️	✔️	✔️	❌
`rust`		✔️	✔️	✔️	❌