https://github.com/kennethormandy/example-dark-mode-readme-specimens

https://github.com/kennethormandy/example-dark-mode-readme-specimens

Last synced: 6 months ago
JSON representation

• Host: GitHub
• URL: https://github.com/kennethormandy/example-dark-mode-readme-specimens
• Owner: kennethormandy
• Created: 2021-11-22T19:39:17.000Z (over 4 years ago)
• Default Branch: main
• Last Pushed: 2021-12-01T09:58:42.000Z (over 4 years ago)
• Last Synced: 2025-06-14T04:05:08.206Z (about 1 year ago)
• Size: 28.3 KB
• Stars: 2
• Watchers: 1
• Forks: 2
• Open Issues: 2
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

          
# Example

![](./specimen.svg#gh-light-mode-only)![](./specimen.svg#gh-dark-mode-only)

## Background

The initial approach in this repository from Jamie Kyle’s [idea for logos in READMEs](https://github.com/jamiebuilds/dark-mode-github-readme-logos) to a sample type specimen:

- [Dark- and light-mode specimens, pt. 1](https://kennethormandy.ck.page/posts/typographic-introductions)

- [Dark- and light-mode specimens, pt. 2](https://kennethormandy.ck.page/posts/dark-and-light-mode-specimens)

…but using media queries assumes the reader’s OS and GitHub theme preference are the same, which isn’t necessarily the case. Shortly after this, GitHub addressed this. The new approach is based on [Daniel Adams’ example](https://gist.github.com/dipree/3bed99af97384541534261dbddaa7a34), modified to use a single SVG via `defs`:

- [Dark- and light-mode specimens, pt. 3](https://kennethormandy.ck.page/posts/)

The sample typeface is [Encode Sans](https://github.com/thundernixon/Encode-Sans).