Awesome Open Source
Awesome Open Source

dev-fonts

List of the best fonts for coding with live preview devfonts.gafi.dev

Features

  • Live preview of all fonts with your code samples
  • Select specific fonts to compare
  • Choose editor themes
  • Choose your language for syntax highlights

Built with

  • Gatsby
  • Code Mirror editor
  • Ant Design
  • Inspired by (code stolen from) https://carbon.now.sh/
  • Hosted on Netlify

Missing a font?

You can open an issue to request adding a new font or open a PR by adding the font under src/data/fonts.ts and static/fonts

  • Include only woff2 (smaller download size). Use font squirrel with basic settings for conversion if needed https://www.fontsquirrel.com/tools/webfont-generator
  • Using a font from an official, reliable CDN is preferred. If not available, then add it in static/fonts.
  • Use sort: 2 for fonts with ligatures, sort: 3 for others
  • Do not change other files or file formatting apart from adding the new font

Get A Weekly Email With Trending Projects For These Topics
No Spam. Unsubscribe easily at any time.
typescript (12,070
typography (103
fonts (90
ligatures (18