Font with Built-In Syntax Highlighting (2024)

(blog.glyphdrawing.club)

103 points | by california-og 6 hours ago

9 comments

  • mg 20 minutes ago
    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?

    • onion2k 1 minute ago
      I have yet to see a good web based text editor with syntax highlighting.

      I slightly expect you to pull a "no true Scotsman" here and suggest it's actually no good because it doesn't really support mobile browsers very well, but Microsoft's Monaco editor that's driven from VS Code is quite good. https://microsoft.github.io/monaco-editor/

    • gethly 7 minutes ago
      FYI, IDEs and editors too don't use "textarea". Contenteditable essentially makes the web browser work like editor does.
  • cyanmagenta 3 hours ago
    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.
    • michaelsshaw 47 minutes ago
      For blogs, I like the site to stay static. This is a neat way to keep it that way. Having your generator do it is better in my opinion though.
  • vbezhenar 5 hours ago
    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.
    • benrutter 5 hours ago
      Unless I missed it, the OP doesn't quote reducing bloat as a motivation- more just working without javascript.

      I took it to be along the lines of an "easier to work with" type motivation, rather than reducing package sizes.

    • WesolyKubeczek 4 hours ago
      Remember llama.otf?
    • blauditore 4 hours ago
      Is it really a script though? IIUC it's more like contextual declaration (e.g. of previous char is X, then use style Y), no?
  • cluckindan 32 minutes ago
    Using a variable font with r, g, b axes for each alt would maybe make it possible to change the colors?
  • spockz 2 hours ago
    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.

    • Sayrus 2 hours ago
      From the article cons section:

      > It only works where OpenType is supported. Fortunately, that's all major browsers and most modern programs. However, something like PowerPoint doesn't support OpenType.

    • layer8 24 minutes ago
      *ligatures

      Is kerning a thing for monospace fonts?

  • zX41ZdbW 4 hours ago
    > 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.

  • exasperaited 20 minutes ago
    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.
  • mock-possum 46 minutes ago
    > 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.

  • Gracana 4 hours ago
    Perhaps you could add this technology to Z80 sans, to get syntax highlighted Z80 disassembly.

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

    • koct9i 1 hour ago
      And add Z80 emulator as well. Just in case.
      • ErroneousBosh 21 minutes ago
        Well someone else mentioned llama.ttf which is a font that embeds an llm, using Harfbuzz's WASM engine.

        So, you could absolutely write a WASM Z80 emulator and embed it in a font. Whether or not you could make it do anything useful, or how strong your grip on reality would remain after? I don't know.

        But it wasn't like you were doing anything else on the days between Christmas and New Year, right?