[HN Gopher] Recursive, a free variable font for code and UI, now...
___________________________________________________________________
Recursive, a free variable font for code and UI, now on Google
Fonts
Author : thundernixon
Score : 189 points
Date : 2020-07-23 16:35 UTC (6 hours ago)
(HTM) web link (fonts.google.com)
(TXT) w3m dump (fonts.google.com)
| alexeiz wrote:
| Neither monospace variant looks good in a Linux terminal or a
| text editor. Linux is very peculiar about rendering fonts, and
| this font is likely designed for macos. I noticed that this font
| doesn't have powerline symbols which makes it even less usable in
| the terminal.
| perardi wrote:
| Wow. That is cool.
|
| If you have a big negative slant, and auto cursive enabled, you
| get much more of a humanist sans-serif, versus a neo-grotesque
| without those parameters. That's a huge amount of character to
| build into one single font.
|
| And the absolute max size for the font is 281kb, and a more pared
| down version is about 100kb. Yes, I know, you'll protest, page
| bloat! But if I wanted to use a non-variable font, each
| individual font would be around 20kb, so if I needed a pretty
| typical stack of 300-400-600 font weights, with matching italics,
| I'm looking at 120kb, with individual requests for each weight.
| thundernixon wrote:
| You can also learn more about Recursive & configure advanced
| Google Fonts API calls on the Recursive minisite:
| https://www.recursive.design/
| enhdless wrote:
| I really enjoyed reading about your design process! I'm also a
| big fan of sign-painting aesthetics.
|
| Can you elaborate more on the technical side? Once you have
| your designs and sketches, how do you go about digitizing those
| and creating the actual font?
| Mizza wrote:
| The capital 'A' renders very strangely for me. Firefox, OSX.
|
| https://i.imgur.com/DmxoWeM.png
| coronadisaster wrote:
| Can you download the font to the server and avoid Google on each
| page load? Or is it a copyright issue?
| jordache wrote:
| why is this a big deal? can someone provide insight?
| kanobo wrote:
| Try out the sliders on https://www.recursive.design
| chrisdalke wrote:
| The Google Fonts page doesn't really do justice to how dynamic
| this font is -- https://www.recursive.design/ has a live demo
| that shows more of the options, maybe the link should be changed
| to their demo.
|
| There are four dimensions and a few other flags that the font can
| be adjusted by in CSS: natural-width to fixed-width, Linear to
| "Casual", Font weight, Font slant, and cursive variants.
|
| By tweaking any of the variable font parameters it you can get
| anything in the range of a "serious" monospace font to a more
| casual font useful for UI mockups. I don't spend a huge amount of
| time in the font design world but this is one of the first
| variable fonts I've seen that feels less like a gimmicky demo and
| more like a seriously versatile tool, really great work!
| nyanpasu64 wrote:
| > There are four dimensions and a few other flags that the font
| can be adjusted by in CSS: natural-width to fixed-width, Linear
| to "Casual", Font weight, Font slant, and cursive variants.
|
| And yet no way to decrease the x-height. I'm sick of fonts
| where the lowercase is tall and the uppercase/ascenders are
| short.
| chrisdalke wrote:
| I've seen the same trend in other recent fonts designed for
| programming, like JetBrains Mono, with the idea that "more
| height" on lowercase letters improves legibility at small
| font sizes. I'm in agreement with your distaste, mostly
| because I work on high-DPI displays where legibility is not
| necessarily an issue and fonts that do this look like a
| "blob" of text.
| airstrike wrote:
| The question is: do we need flexible fonts? Other than fine-
| tuning the monospace font to fit your exact preferences given
| the hours you spend coding, everything else seems to be a
| matter of just picking an appropriate type that fits your
| project
| chrisdalke wrote:
| Just speculating, but this could help in any web project
| where you're including multiple font weights/styles --
| Currently that involves building a CSS font-family from
| multiple font files which have a lot of redundant
| information. With a variable font, your font family could
| pull from a single font file and use the font parameters to
| tweak different styles.
|
| The HN audience loves to discuss the bloat in web design --
| If you can reduce 500kb of font-<heavy, bold, italic, light>
| files into a single file that interpolates between font
| vectors dynamically, that goes a long way to avoiding
| excessive resources. And you also get the benefit of being
| able to tweak the parameters of each font style without
| changing out static files.
|
| For example, with Recursive the entire static font family
| come in at 12.8mb, while the dynamic font family in a single
| file is 1.45mb. Obviously you wouldn't load up every variant
| and Recursive is a very large font, but I could certainly
| imagine replacing ~8-10 font files with a single variable
| font.
| Klathmon wrote:
| They offer web optimized versions. The full variable font
| in woff2 comes in at 523kb, and then there are subsets
| available from there (reduced character set, reduced
| customizability), and you can even build your own font with
| only what is needed.
| seanwilson wrote:
| Are variable fonts supposed to have a smaller file size?
| The examples I've looked at have been bigger than
| including all the variations you'd expect to use of the
| non-variable version. Are there examples of a significant
| file size saving?
|
| Generally with web design, you want to stick to a small
| number of font weights anyway so if the file size isn't
| smaller, what's the core motivation?
| rememberlenny wrote:
| It depends. The font rendering process is based around
| "masters" which can vary in count. One font could have
| one master for all the weights, or multiple masters - for
| the bold/normal/light. Depending on the master count, the
| size can differ.
|
| The key thing also is the number of web requests. This is
| not a trivial detail. One variable font can be less web
| requests.
| seanwilson wrote:
| > The key thing also is the number of web requests. This
| is not a trivial detail. One variable font can be less
| web requests.
|
| Is the number of web requests a factor if you're using
| HTTP/2 though?
| MildlySerious wrote:
| Variable fonts are a nice match for rich text editors. They
| allow you to have any combination of italic and font weight
| without having to load in a whole font family.
| crazygringo wrote:
| As a coder, probably not.
|
| As a designer, absolutely. The exact weight of a font can
| make a ton of difference in a finished product, and it's
| frequent to be frustrated that the font isn't available in
| the weight that would look right for the needs -- you need
| something in between semibold and bold, or something in
| between regular and condensed, or something oblique but not
| _that_ oblique.
|
| It's the difference between a design being good, and a design
| being beautifully "just right" with everything _perfectly_ in
| proportion.
|
| So for that, variable fonts are a godsend.
|
| That being said, I've never seen a slider between
| proportional and monospace before. That's just weird. :)
| WA wrote:
| Interesting. But given that so many big brands simply use
| Arial or Helvetica for their logo and brand, is this
| _really_ a thing?
| crazygringo wrote:
| Helvetica (Neue) comes in more weights and variations
| than practically any other typeface. So it _is_ really a
| thing.
|
| https://www.myfonts.com/fonts/linotype/neue-helvetica/
|
| Also, Helvetica is popular in large part because of the
| very precise personality it has with is quite amenable to
| the image corporations often like to portray. It become
| widely available on computers, starting with Macs,
| because it was already such a useful font. Major
| corporations aren't choosing Helvetica simply because
| it's a default font on computers. And, of course, it's
| not like a majority of companies use Helvetica for their
| branding or anything -- it's a popular font, but where
| popular means maybe 3% or 5%, not 50%.
| thewarpaint wrote:
| That's a wonderful showcase of the posibilities of variable
| fonts, thanks!
| unicornporn wrote:
| I really must recommend Inter[1]. It's also open-source and
| available as variable.
|
| [1] https://rsms.me/inter/
| flixic wrote:
| Inter is almost as good as Apple's SF, and with a much more
| permissive license. It's my default when designing apps for the
| web.
|
| I used to default to "system font stack", but that was always
| because SF is such a great font. Defaulting to Ubuntu font on
| Ubuntu is... unfortunate. Luckily, Inter is fantastic, and it
| can be fantastic on every OS.
| phaedryx wrote:
| There are several things I look for in a "code" font: distinct 0
| vs O, distinct l vs 1, readability, etc.
|
| I don't think I'd use this for code, but I might for UI.
|
| Edit: it seems that the variations are more code-oriented when
| you shift the code more "MONO" (based on experimentation on its
| website)
| ape4 wrote:
| In fact instead of "The quick brown fox jumps over the lazy
| dog" there should be a standard sentence for code fonts using
| those characters. Zero[0] = Oh[0]; One[1] = El[l]; or something
| ;)
| phaedryx wrote:
| yes!
|
| Il|i! and DO0Q
| [deleted]
| brettermeier wrote:
| With parameter mono set to min. 0.5, you have a distinct 0 and
| O. And also serifs, nice font.
| phaedryx wrote:
| I like 0 vs O better, but 1 vs l worse:
| https://imgur.com/a/1tXx8aH
| ebg13 wrote:
| What is "parameter mono set to min. 0.5" and where do you
| find that?
|
| [edit: Oh I see. It's not on the linked page but on the
| font's homepage.]
| Twirrim wrote:
| Yeah, there's a lot of detail that is missing by linking us
| to the Google Font website instead of the font's website,
| https://www.recursive.design/
| dylan604 wrote:
| Came to say the same thing. I placed an uppercase letter 'O'
| next to a zero in the preview text. They are very similar
| looking. I much prefer fonts with a dot or slash in the zero.
| If they go ahead and place a bar across the number seven and
| letter 'Z', I'm a bigger fan
| anotherfounder wrote:
| This is so great! Has anyone put out a good variable Serif font
| that is taking advantage of all the variables?
| pgtan wrote:
| Since I have to do lots of TeX editing in emacs, every "coding"
| font disqualifies, if it doesn't have at least polytonic greek
| and cyrillic glyphs. So, misc-fixed forever!
| sipjca wrote:
| This is by far the coolest font I've seen. Having this level of
| customizability in one font seems like a fantastic idea
| khaledh wrote:
| I know this font is about versatility, but when it comes to a
| coding font I have yet to find something that beats JetBrains
| Mono (and I've tried many coding fonts).
|
| https://www.jetbrains.com/lp/mono/
| hmhrex wrote:
| I haven't seen this yet. Just downloaded and installed for VS
| Code and it makes a huge difference. Thanks for the
| recommendation!
| minerjoe wrote:
| Terminus for the win!
| jerrygoyal wrote:
| On windows, I tried dozens of trending fonts like fira code,
| new ms font, jetbrains etc but nothing looks more natural to
| read than Consolas (and also Roboto mono)
| edwintorok wrote:
| Since we're onto recommendations, I've been using 'Go Mono' for
| a while: https://fontlibrary.org/en/font/go-mono
| https://blog.golang.org/go-fonts
|
| Wish the 'Recursive' font had a 'Slab-Serif' slider too,
| would've been interesting to compare.
| greenmana wrote:
| Have you tried Inconsolata? I like Jetbrains Mono a lot too,
| but somehow still stick to Inconsolata, even after trying so
| many others so many times.
| raphlinus wrote:
| Also, Inconsolata 3.0 is _also_ a variable font with a wide
| range, including widths from 0.5 to 2.0 of the standard
| width. I need to see about doing something similar to the
| Recursive mini-site where I show that off and explain how to
| get access to the capabilities, but have been busy with other
| stuff.
| kanobo wrote:
| The designers did an amazing job. Setting --mono to 1.0 makes it
| look very similar to Jetbrain's font which I like.
| ChristianGeek wrote:
| The lowercase "m", for one, looks terrible though. It's a cool
| demo but I'd never use it.
| vz8 wrote:
| Die-hard fan of Iosevka[0], a narrow monospace font family
| (regular and term) and nerd-font patched varieties [1].
|
| Just love how they display in emacs gui on a 4k display.
|
| [0] https://typeof.net/Iosevka/ [1]
| https://github.com/ryanoasis/nerd-fonts/tree/master/patched-...
| FireBeyond wrote:
| The Slab variant is still my go-to, even after paying for
| things like Operator Mono and Pragmata Pro.
| m0zg wrote:
| Only latin glyphs. Pizdets.
___________________________________________________________________
(page generated 2020-07-23 23:00 UTC)