I tried googling "black bar font" to find what the extension dev is using without downloading the extension, but gave up when I saw the Google results and realised how unlikely I am to find "font which doesn't need downloading and installing or hosting which renders normal characters as black bars".
As the sibling comment mentioned, it's Flow [1] [2], which has Block, Circular and Rounded variants. Elsewhere people also mentioned the Redacted font as a usable alternative [3] [4]. Both are available on Google Fonts.
I get that you were trying to be amusing with the Chrome comment, but in case you weren't actually aware, you only need to push the plus icon to insert a new style. It's the exact same number of clicks to accomplish that task in both browsers.
I was aware because I clicked plus[1] and pressed ctrl-v to put my firefox line in. And it broke because Chrome is "being helpful" by forcing structure in the UI, so it instantly turned into a lot of crossed out lines with yellow warning triangles, and there's there's no visible delete option, no context menu delete, it doesn't respond to the delete key, and Chrome's F12 is just so much more user-hostile than FireFox every time I touch it, like they're kinda forced to have one so people can develop websites I guess, but they'd intensely rather nobody had a good time because that's a potential loophole people could use to remove adverts.
Compare that to FireFox which just has a text box and you can type into it, or delete out of it.
[1] with that delightful UX where it's /invisible/ until you wave the magic cursor around in the right place.
> with that delightful UX where it's /invisible/ until you wave the magic cursor around in the right place.
There is a button at the top of the editor, to the right of the filter input. The buttons that show up on hover are for inserting the new style at a specific position in the cascade, if needed -- but that's a rarer occurrence, which is why it's not visible by default.
> And it broke because Chrome is "being helpful" by forcing structure in the UI, so it instantly turned into a lot of crossed out lines with yellow warning triangles, and there's there's no visible delete option, no context menu delete, it doesn't respond to the delete key
I agree that one should be able to paste any CSS block or declaration and expect the style editor to parse it. But it's also worth keeping in mind that the only difference in this particular situation is pasting the declaration instead of the surrounding block, and you'd get the results you're after. Chromium's dev tools are definitely not perfect, but I think Firefox's method is much more cumbersome from a developer's perspective.
