status: active
timestamp: 2026-06-20
tags: [code-snippet, embed, static, primary]
GitHub Gists
Static code snippets embedded via script — free unlimited public gists
GitHub Gists
Role
Hosts static code snippets embedded in oriz-blog-site posts —
copy-paste fragments, config blocks, one-file utilities, anything
where a runnable playground is overkill and we just want syntax-
highlighted code with a “view raw” link. Embedded via gist’s
<script src="...js"> one-liner (turns into a styled <div> with
GitHub’s syntax theme).
Free tier
- Unlimited public gists
- Unlimited secret (unlisted) gists
- Unlimited embeds
- Syntax highlighting for every language GitHub supports (~600)
- Git-backed — every gist is a real repo, clonable + diffable
- Comments + revisions per gist
Card / subscription required?
NO. Comes with the free GitHub account we already have for oriz-master-repo. No separate sign-up, no payment method.
Embed pattern
<script src="https://gist.github.com/chirag127/abc123def456.js"></script>To embed a single file from a multi-file gist:
<script src="https://gist.github.com/chirag127/abc123def456.js?file=oriz-config.ts"></script>Gist embeds inject their own stylesheet (gist.github.com origin) — we
let them through CSP via style-src https://github.githubassets.com.
Alternatives
- StackBlitz — overkill for static snippets, used for full-stack demos
- CodePen — overkill for one-language fragments, used for CSS-heavy demos
- Carbon (carbon.now.sh) — pretty PNG, but not embeddable as live text → fails accessibility (screen readers can’t read PNG code)
- Pastebin — ads, no syntax theme parity with GitHub, secret gists already cover the unlisted use case
Swap cost
Zero — the gist source IS a git repo, git clone https://gist.github.com/<id>.git and re-host anywhere. The post-side coupling is one <script> tag.
Why this is our pick
Already part of our GitHub account, costs nothing extra, embeds are accessible (real text, not images), and revision history means if we update the snippet the embed updates everywhere it’s referenced. For “screenshot-style” code blocks in social cards we use Ray.so instead — Gists are for in-post embeds where the reader needs to copy-paste.
Cross-refs
- StackBlitz — sibling for full-stack playgrounds
- CodePen — sibling for CSS-heavy demos
- Ray.so — generates pretty PNG screenshots for social og:image (different role)
- No card-on-file rule