Font with Built-In Syntax Highlighting (2024)

I view stuff like this kind of like code that fits into a bootloader or whatever. It’s really more of the technical challenge than to actually solve a problem. The result is much better if you just run a script on your hand-coded file to add syntax highlighting as DOM elements. Still, love seeing stuff like this.

So script inside web page is bad, but script inside font is good? That's interesting definition of bloat. I'd prefer ordinary webpage using locally installed fonts with explicit JavaScript snippet to highlight keywords.

Large discussion from the last time it was posted:

665 points | 137 comments

https://news.ycombinator.com/item?id=41245159

This is interesting.

I have yet to see a good web based text editor with syntax highlighting. They all mess with the native search functionality of the browser. Because they can't just use a textarea for the edit area. With this approach, it would be possible.

I wonder how usable a Python version of this would be?

Has anyone tried this with PowerPoint yet? Our org is very PowerPoint centric and always struggle a bit with the workflow for code.

Copy pasting from IntelliJ does give colours but none of the other niceties such as kerning or litigation. Screenshots are nice visually but a pain to maintain.

> I want to keep things as simple as possible.

The whole post proves the opposite is true!

> it breaks when your code goes to a newline. there's no way to keep context line to line...

This is a blocker for my applications.

Using a variable font with r, g, b axes for each alt would maybe make it possible to change the colors?

Perhaps you could add this technology to Z80 sans, to get syntax highlighted Z80 disassembly.

https://github.com/nevesnunes/z80-sans

> Works in <textarea> and <input>! Syntax highlighting inside <textarea> has been previously impossible, because textareas and inputs can only contain plain text. This is where the interesting

Interesting indeed! This bit feels like a neat bit of hackery to keep in my back pocket for sure.

> The colors in the HTML snippet above comes from within the font itself, the code is plain text, and requires no JavaScript.

But then why does the color disappear if I disallow scripts on this page? Instead of your font, now it uses Consolas.

Are you using JS to load the font in? (if so... web fonts don't need JS to load =)

This is a curious sort of hazy modern mirror image of the world of Sinclair computers, that embedded their BASIC parsing in the keyboard driver — that is to say, it essentially wasn't possible to type a syntactically incorrect BASIC program.